Sections

Sections are the building blocks of your pages. In the theme editor, select Add section on a page to see the list. Inside a section, Add block adds items such as a slide, a question, or a button.

Most sections share these settings, which are not repeated below:

• Color scheme: Which of your color schemes the section uses.
• Top padding and Bottom padding: Space above and below the section, from 0 to 160 pixels.
• Make section full width: On sections that offer it, lets the section run edge to edge instead of staying inside the page width.
• Subheading and Heading: A small label above a larger headline. Leave blank to hide.

Sections are grouped here by where you will use them: header and footer, home page (these work on any page), product, collection and search, cart, and other pages.

Section names below match what you see in the theme editor.

Header and footer

These sections live in the header and footer areas and appear on every page.

Announcement bar

A slim bar at the top of the store for shipping notices, sales, and short messages.

When to use it: Free shipping thresholds, a current sale, or a launch date. Keep messages short and true.

Blocks (up to 6):

• Announcement: A line of Text with an optional Link.
• Countdown (one allowed): Text plus an End date and time, with an optional link. See Countdown.

Settings:

• Rotate announcements automatically: On by default. With more than one message, visitors can also pause and step through them with buttons.
• Change announcement every: Seconds between messages, from 3 to 10.

Header

The logo, main menu, search, account, and cart.

Settings:

• Main menu: Which menu to show. Defaults to "Main menu".
• Customer account menu: The menu shown to signed-in customers.
• Logo position on large screens: Left or Center.
• Sticky header: None, On scroll up (the header returns when the visitor scrolls up), or Always.
• Show country/region selector and Show language selector: Appear only if your store has more than one market or language.

Blocks:

• Mega menu: Turns one main-menu item into a full-width panel. Enter the exact name of a main menu item that has sub-items in Menu item, then pick a Layout:
  • Link columns: One column per sub-item, with its own sub-items listed under it.
  • Picture tiles: Each sub-item as a tile with its collection or product image.
  • Links and products: The sub-items as a list beside product cards from a Collection you choose (2 to 4 products).

Every layout can add a promotion with an Image, Heading, Button label, and Link.

Footer

Menus, text, social icons, newsletter signup, and the legal bar.

Blocks (up to 8):

• Menu: A Heading, a Footer menu (defaults to "Footer"), and a Column width from 2 to 12.
• Text: A Heading, Text, and a Column width.
• Social media (one allowed): A Heading and column width. The icons come from Theme settings > Social media.

Settings, in the Bottom bar group: Show country/region selector, Show language selector, Show payment icons, Show Follow on Shop (needs Shop Pay turned on), and Show policy links.

Email signup popup

A modal window that asks for an email address after a delay. It sits in the overlay area, so it can appear on any page.

Settings:

• Heading, Text, and an Image.
• Show after: Seconds before it opens, from 3 to 60.
• Show again after (days): How long before the same visitor sees it again, from 1 to 60. This is remembered in the visitor's own browser.

In the theme editor, the popup opens only while you have its section selected, so it does not cover what you are editing.

Age verifier

A full-screen age check. Visitors must answer before they can browse. Pressing Escape or clicking outside does not close it.

Settings: Heading, Text, Confirm button label, Decline button label, Message after declining, and Remember answer for (days) from 1 to 60.

When to use it: Only if you sell age-restricted products and your region requires a check.

Home page sections

These sections work on the home page and on any other page you build in the theme editor, including custom pages (Online Store > Pages, then choose a template).

Slideshow

A rotating hero with up to 6 slides.

Blocks:

• Slide: Image (2400 x 1200 px recommended), optional Mobile image, Subheading, Heading, Text, Button label, Link, Text position (Top left, Center, or Bottom left), and a Color scheme for that slide's text.

Settings:

• Layout: Text on image or Text beside image.
• Height: Short, Medium, or Tall.
• Overlay opacity: Darkens or lightens the image so text stays readable.
• Rotate slides automatically, with a seconds setting between 3 and 12.
• Accessible label: Describes the slideshow for screen reader users.

Image banner

One large image with a headline and a button.

Settings: Image, Mobile image, Subheading, Heading, Text, Button label, Link, Text placement (On image or Below image), Height (Short, Medium, Tall), Overlay opacity, and Text color scheme.

Scrolling text

A moving strip of short messages, good for a brand line or shipping promise.

Blocks (up to 8): Message with Text and an optional Link.

Settings: Speed (seconds for one full pass, 10 to 60). Defaults to the signal color scheme.

Rich text

Free-form text content. Use it for introductions, brand statements, or a short call to action.

Blocks: Heading, Text, Button, Custom Liquid, and apps.

Settings: Alignment (Left or Center).

Image with text

An image or looping video beside a short story.

Blocks (up to 6): Point: one line of text, shown as a bullet.

Settings:

• Image, or Video (plays muted and looped while on screen, with a pause button; replaces the image).
• Aspect ratio: Square, Portrait, or Landscape.
• Media position on desktop: Left or Right.
• Button label and Button link. On product pages, an empty link jumps to the buy box.

Feature grid

A grid of benefits or proof points.

Blocks (up to 8):

• Feature: An Icon (check mark, truck, return, shield, lock, gift, star, heart, leaf, clock, battery, chat, or none), or an Image that replaces the icon, plus a Heading and Text.
• Figure: A big number such as "92%", with a Label and a Source. Only use figures you can back up, and name the source.

Settings: Alignment (Left or Center) and Columns on desktop (2 to 4).

Featured collection

A row or grid of products from one collection.

Settings: Collection, View all link label, Maximum products to show (2 to 16), Columns on desktop (2 to 5), Layout (Grid or Carousel), Image ratio (Square, Portrait, Landscape), and Show quick add. See Quick add and quick view.

Collection list

Cards that link to your collections.

Blocks (up to 12): Collection.

Settings: Layout (Grid or Carousel), Columns on desktop (2 to 5), and Image ratio.

Collection tabs

Several collections in one place; shoppers switch between them using tabs.

Blocks (up to 6): Tab with a Collection and a Tab label (defaults to the collection title).

Settings: Maximum products to show (2 to 12) and Columns on desktop (2 to 5).

Featured product

One product with its buy box, placed anywhere.

Settings: Product, Media layout (Featured first, then two columns, One column, or Thumbnails under one large image), Media position on desktop, and Enable image zoom.

Blocks: Title, Vendor, Price, Variant picker, Quantity selector, Buy buttons, Inventory status, Description, Collapsible tab, Text, Custom Liquid, and apps. These work the same as the product information blocks.

Bundle builder

Lets shoppers pick a set number of products from a collection and add them all in one click. See Bundle builder before you use it, because the bundle price comes from a discount you create.

Settings: Heading, Text, Collection, Maximum products to show (3 to 12), Products in a bundle (2 to 6), and Savings note.

Shoppable image

A lifestyle photo with clickable dots that open product cards.

Blocks (up to 8): Hotspot with a Product, plus Horizontal position and Vertical position (0 to 100 percent) to place the dot on the image.

Settings: Image and Aspect ratio.

Before and after

A draggable slider that compares two images.

Settings: Before image, Before label, After image, After label, and Aspect ratio. Use real results only.

Comparison table

Compares up to four products or options side by side.

Settings: For each of four columns, a Product (optional) and a Column name.

Blocks (up to 20): Feature (a row) with a Feature name and a value per column. Enter yes or no to show a check or a dash, or any short text.

Timeline

A vertical story of milestones, good for brand history or "how it's made".

Blocks (up to 12): Milestone with a Label, Heading, Text, and Image.

Product finder

A short quiz that sends shoppers to a filtered collection.

Before you use it: Enable the Tag filter in the Search and Discovery app so answers can filter products.

Settings: Results collection.

Blocks (up to 5): Question with up to four answers. Each answer filters by its tag. Leave the tag empty to use the answer text. Tags must match the tags on your products.

Testimonials

Customer quotes with optional star ratings.

Blocks (up to 12): Testimonial with a Quote, Author, Rating (0 to 5) and an optional Product. Only enter a rating the customer actually gave; 0 hides the stars.

Settings: Anchor: Lets other blocks link to this section. For example, enter reviews here and enter the same word in the Rating block's Reviews section anchor so the product stars scroll to this section.

Collapsible content

Expandable questions and answers.

Blocks (up to 20): Question with a Question and Answer.

Settings: Layout (Heading above questions or Heading beside questions), Open first question, and Add question data for search engines. Turning that on helps search engines show your questions in results. Only turn it on when the questions and answers are visible on the page and are true.

Video

A video from Shopify or from a link.

Settings: Shopify-hosted video, Video link (plays when no Shopify-hosted video is selected), Cover image, and Aspect ratio (Wide, Landscape, Square, Vertical).

Logo list

A row of "as seen in" or partner logos.

Blocks (up to 12): Logo with an Image (160 x 80 px PNG recommended) and a Link.

Settings: Show logos in one color: On by default.

Trust strip

A row of short promises with icons, such as shipping, returns, secure checkout, and support. Best placed right under the buy box or the hero. See Trust strip.

Blocks (up to 4): Promise with an Icon, Heading, and Text.

Recently viewed

Shows products the visitor viewed on this device. Hidden until they have viewed a product.

Settings: Maximum products to show (2 to 6).

Email signup

An inline signup form. Submissions add a customer with the tag "newsletter" to your Customers list.

Settings: Layout (Text beside the form, Centered, or Image beside the form), Image (for the image layout), Heading and Text.

Beam and columns

A flexible layout: a headline (the "beam") with columns of content above, below, or beside it.

Beam settings: Subheading, Heading, Button label, Button link, Beam position (Above columns, Below columns, or Beside columns), and Show beam line.

Layout settings: Column spacing (0 to 80 px).

Blocks (up to 12): Column, plus apps. See Theme blocks for what goes inside a column.

Custom Liquid

For app snippets and custom code. Only use code from a source you trust.

Settings: Liquid code.

Product page sections

Product information

The main section of every product page: media gallery, title, price, options, buy buttons, and more. See Product pages for every block.

Settings:

• Media layout: Featured first, then two columns, One column, or Thumbnails under one large image.
• Media position on desktop: Left or Right.
• Enable image zoom: Opens images in a zoom window when clicked.
• Show sticky add to cart bar: See Sticky add to cart.

Related products

Product suggestions generated from order and product data. They improve over time. Available on product templates only.

Settings: Heading, Maximum products to show (2 to 10), and Columns on desktop (2 to 5).

Other sections that work well on product pages

Trust strip, Image with text, Feature grid, Comparison table, Testimonials, Collapsible content, Timeline, and Recently viewed all appear in the supplied product templates. See Product pages.

Collection and search sections

Product grid

The collection page.

Banner group: Show collection description and Show collection image.

Product grid group: Products per page (8 to 48), Columns on desktop (2 to 5), Columns on mobile (1 or 2), Image ratio (Square, Portrait, Tall, Landscape), Show second image on hover, Show color swatches, Show quick add, and Pagination (Page numbers, Load more button, or Infinite scroll).

Filtering and sorting group: Filter layout (Sidebar, Above products, or None) and Enable sorting. Customize filters with the Search and Discovery app.

Promotion tile block: Puts a tile with an image, heading, text and link inside the product grid, on the first page only. Choose its Position in the grid (1 to 24) and Width (one or two columns). Up to four tiles.

Collections list page

The page that lists all collections.

Settings: Heading, Collections per page (6 to 48), and Image ratio.

Search results

The search results page.

Settings: Results per page (8 to 48), Columns on desktop, Image ratio, Show quick add, Pagination, Filter layout (defaults to Above products), and Enable sorting.

Live search suggestions appear as shoppers type in the header search. They have no settings.

Cart sections

Cart

The full cart page, used when Cart type is Page or when shoppers open the cart link directly. It shows cart goals, items, order notes, gift wrapping, cart recommendations, and the checkout button.

Cart drawer

The slide-in or popup cart. Its settings are in Theme settings > Cart; the section itself only has a Color scheme.

Other pages

Page

Standard pages such as About or Shipping. Add content with the page editor under Online Store > Pages.

Contact form

A contact form for the contact page template. Settings: Heading.

Blog posts and Blog post

The blog list and article pages.

Blog posts settings: Layout (Grid or Large first article), Articles per page (3 to 24), Show featured image, Show date, and Show tags.

Blog post settings: Show featured image, Show author, and two optional parts under the article:

• Products in the story: a grid of products named in an article metafield (default custom.related_products, type List of products), with its own heading.
• Questions: questions and answers from an article metafield (default custom.faq, type JSON), shown as an accordion and added to search results as FAQ structured data. See Article metafields.

404 page

The "page not found" screen.

Password page

The page visitors see while your store is password protected.

Theme blocks

Theme blocks are small, reusable pieces you can place inside sections that accept them (Rich text and Beam and columns' Column block).

Tip on headings: use one H1 per page. Section headings are usually H2.

Behind-the-scenes sections

A few sections have no settings because they only render content on demand: the cart items inside the drawer, the quick view window, the live search results, the "bought together" rows, and the recently viewed cards. You do not need to add or edit them.