Every section has Color scheme, Top padding and Bottom padding unless noted otherwise. Sections can be added to any page template.
Editorial hero
A large opening image with a heading, text and buttons.
- Layout: Split (image beside the text) or Full width (text over the image).
- Image.
- Mobile image: optional. It replaces the main image on screens under 750px; use a portrait crop. Only the image for the current screen size is downloaded.
- Inset image and Image caption: Split only.
- Image position (Right or Left), Height (Medium or Full screen).
- Vertical alignment, Content alignment, Overlay opacity (Full width only; darkens the image behind the text).
- Blocks: Heading, Text, Button.
- Tip: in the first section of the page, set the Heading block’s HTML tag to H1. Use only one H1 per page.
- When the layout crops a tall image, the top of the photo stays in view (faces and necklines), unless you set a focal point on the image.
Editorial story
A numbered chapter with a large image, a detail image and text.
- Chapter number, Chapter label, Image, Detail image, Image position, Image ratio.
- Blocks: Heading, Text, Quote, Button.
Image with text
- Image, Image ratio, Image position.
- Overlap the text panel on the image: lays the text panel over the edge of the image.
- Text panel color scheme.
Brand statement
A centered statement.
- Content alignment, Show decorative line.
- Blocks: Heading, Text, Quote, Button.
Marquee
A slow, continuous line of short text (seasons, promises, press words).
- Text blocks (italic text uses the accent color), Text size, Separator (Dot, Dash, Star, None), Loop duration (longer is slower), Direction, Show top and bottom borders.
- It pauses when visitors hover it (mouse) or tap it (touch screens), and keyboard users get a pause button. It stays still for visitors who prefer reduced motion.
Featured collection
- Collection, Eyebrow, Heading, Link label.
- Layout: Grid, or Editorial, where the first product becomes a large 2×2 feature when there are more than two columns. The feature’s image ends exactly level with the images beside it, and its title sits on their title line.
- Products to show, Desktop columns, Mobile columns.
- Without a collection, the section shows placeholder cards and links to all products.
Featured product
Sell one product from any page, with its full gallery and buy buttons.
- Product, Image position, Gallery layout, Image ratio, Enable full screen images.
- Blocks: Vendor, Title, Text, Price, Variant picker, Inventory status, SKU, Quantity selector, Buy buttons, Description, Collapsible row, Custom Liquid, View details link, and app blocks.
Collection list
- Eyebrow, Heading, Layout (Mosaic, where the first collection is a large tile, or Grid), Desktop columns, Show product count, Show view all link.
- Add one Collection block per collection. The card uses the collection image, or the image of the collection’s first product when no collection image exists.
- In Mosaic, tiles in an unfinished last row widen to fill it; a single leftover tile becomes a wide banner.
Lookbook
Shoppable images.
- Eyebrow, Heading, Product card color scheme.
- Look block: Image, Image caption, Product (adds a hotspot), Hotspot horizontal position, Hotspot vertical position (percent from the left and top edges).
- Hotspots work with touch, mouse and keyboard: Tab to a hotspot, then press Enter to open its product card. On phones, the looks scroll sideways.
Multicolumn
- Eyebrow, Heading, Desktop columns, Show numbers.
- Column block: Image, Title, Text, Link, Label.
Collapsible content
Frequently asked questions or other expandable rows.
- Eyebrow, Heading, Text, Open the first question.
- Question block: Question, Answer, Page content (shows a page’s content instead of the answer).
Video
- Shopify-hosted video (takes priority over a URL) or YouTube or Vimeo URL, plus Cover image.
- Play as a muted background loop: Shopify-hosted videos only. A pause button is always shown, and the video stays paused for visitors who prefer reduced motion.
- Image ratio, Width, Image caption.
Blog posts
- Blog, Eyebrow, Heading, Posts to show, Desktop columns, Feature the newest article, Show date, Show author, Show view all link.
Newsletter
- Heading, Text. Signups are saved as customers who agreed to receive marketing email (Customers in admin).
Product recommendations
- Heading, Recommendation type (Related or Complementary), Products to show, Desktop columns.
Custom section
A flexible section built from theme blocks (Heading, Text, Button, Quote, Group).
- Background image: decorative, so screen readers skip it. Keep important text in blocks, not in the image.
- Mobile background image: optional; replaces the background under 750px.
- Overlay opacity: tints the image with the color scheme’s background, so text keeps its contrast.
- Minimum height (Fit content, Small, Medium, Large), Vertical alignment, Content width, Content alignment.
- Color scheme, Top padding, Bottom padding.
- As the first section on a page, the background loads immediately; further down the page, it loads as visitors scroll.
- Use Group to place blocks side by side (Layout direction: Horizontal; items wrap on small screens and follow the section’s content alignment) or stacked (Vertical, with Alignment).
Custom Liquid
- Liquid code, Width. For app snippets or small customizations. Invalid code can break the section, so preview before publishing.
Theme blocks reference
- Heading: Heading, Size (Display to Small), Maximum width, HTML tag.
- Text: Text, Style (Body, Lead paragraph, Caption, Eyebrow), Maximum width.
- Button: Label, Link, Style (Solid, Outline, Text link).
- Quote: Quote, Attribution, Size.
- Group: Layout direction, Alignment, Padding.