Editorial sections

01 / Lead

Hero and video

Editorial hero and Video story are designed for the first visual moment of a page. Both support separate mobile media, configurable copy, actions and reduced-motion behavior.

• Use a real mobile crop instead of relying on desktop focal points.
• Autoplay video must remain muted and inline.
• Keep overlay copy concise and contrast-safe.

02 / Composition

Campaign grids and mosaics

Campaign grid mixes products, collections, images and video. Media mosaic and Editorial grid create asymmetric visual rhythm without requiring custom code.

Spans

Control how many columns a campaign item occupies.

Media ratio

Define whether a tile follows its source or a campaign crop.

Mobile order

Reorder content to maintain narrative sequence on small screens.

Dynamic sources

Connect compatible media and copy to Shopify data.

03 / Narrative

Sticky stories, pairs and image accordions

Use Sticky story for chapters, Editorial pair for two equal stories and Image accordions for a compact set of categories or worlds.

04 / Compare

Before / after

Before / after compares two responsive images through a native range control. It supports touch, pointer and keyboard interaction, separate mobile images and editable visible and accessible labels.

• Use images with matching framing.
• Keep Before and After labels factual.
• Check the focus ring and keyboard arrow behavior before publishing.

05 / Proof

Editorial endorsements

Editorial endorsements combines verified press mentions and genuine customer testimonials in one original card system. Choose grid or carousel and Minimal, Surface or Glass presentation.