Shared and system page sections
This article covers the sections you can add to any page type, plus the fixed sections that come with each system page. For how to add and arrange sections, see Sections and blocks.
Sections you can add to any page
These appear in the Add picker on every page type.
Text
A standalone text section for a heading or paragraph. Up to 3 per page. Full typography settings are documented in Layout components.
Image
A standalone image section. Up to 3 per page. Configure width (fit, fill, or a custom percentage), alignment, aspect ratio (auto, portrait, square, or landscape), fit (cover or contain), border radius, padding, and an optional click-through link.
Divider
A separator line. Up to 10 per page. Configure thickness, length (a percentage of the container), end cap style, alignment, color scheme, width (fit or fill), and padding. See Layout components.
Social media icons
A standalone row of social platform icons (one per page). Look is Icons (full shape and palette control) or Apps (each platform as a branded colored circle). Mode is Inline (in the page flow) or Fixed (anchored to the left or right edge of the viewport, always visible while scrolling), with an option to fall back to inline on mobile. Supported platforms: Facebook, Instagram, Threads, X, TikTok, Snapchat, YouTube, LinkedIn, Pinterest, Tumblr, WhatsApp, and Telegram, each entered as a username (WhatsApp as a phone number). Settings: icon size (12 to 64 px), gap (0 to 48 px), alignment, shape (none, circle, rounded, square), fill style (flat or outline), container size (26 to 80 px), palette (brand colors, mono, or a custom hex color), and hover effect (none, brand, scale, lift, opacity).
Custom code
A section for raw HTML, CSS, and JavaScript (up to 5000 characters each, maximum 2 per page). Your HTML renders inside a unique container, your CSS is auto-scoped to that container so it cannot affect other sections, and your JavaScript runs in an isolated scope with the container passed in, loaded after the page is ready. Useful for third-party widgets and embeds.
FAQ
An accordion of question and answer pairs. Available on the home and product pages. Set color scheme, width (page or full), and padding.
System page sections
Each system page ships with one required section that defines its core function. These cannot be deleted, only configured, though you can still add Text, Image, Divider, and other any-page sections around them.
- Collection products (collection page): the product grid for a collection. Configure desktop columns, mobile columns (1 or 2), gap, width, color scheme, and the product card layout.
- Search products (search page): the results grid, using the same grid and product card controls as Collection products.
- Contact (contact page): a form with name, email, subject, and message fields. Set the spacing between fields, the submit button label, and its style (primary or secondary). You can place Text and Group blocks around the form.
- Cart (cart page): the shopping cart with line items, totals, and checkout entry.
- Checkout (checkout page): the checkout flow with customer and payment fields.
- Order confirmation (thanks page): the post-purchase summary that shows the order details, customer info, totals, and selected shipping and payment methods.
- Policy (policy page): renders your legal page content (title and body). You write the policy text in store settings; this section controls only its appearance.
- 404 (404 page): the page-not-found section, with a heading, description text, and a button back to the home page.
For the home, product, and landing page sections, see Home page sections and Product and landing page sections. For the header, footer, and announcement bar, see Global sections.