Rail sections and blocks

A section is a band of a page. A block is an item inside a section. In the theme editor you add, remove and reorder both, so your store's pages are yours to arrange. Names below match the editor exactly.

How sections work in Rail

Add a section: in the left sidebar of the editor, choose Add section and pick one from the list. Drag sections to reorder them. Use the eye icon to hide one without deleting it.
Color scheme and spacing: every content section has a Color scheme setting and the checkboxes Remove top spacing and Remove bottom spacing. Use the checkboxes to join two sections with no gap.
Where sections can go: Announcement bar and Header belong only to the header group. Footer belongs only to the footer group. Content sections (everything under "Home page sections" and "Content sections" below) can be added to any page, but not into the header or footer groups. Custom Liquid can also be added to the footer group.
Main sections (the ones named Product, Collection page, Cart items, Blog and so on) are the heart of a page template. They cannot be added elsewhere or removed, but you can change their settings and, for some, reorder their blocks.
Block limits: some blocks can be added only once (for example one Newsletter block in the footer). The editor hides the option when you reach the limit.
Rich text fields: in heading fields marked as rich text, wrap one word in italics to render it in the Accent font (set in Theme settings > Typography).

Header group and footer group

Announcement bar

A slim bar at the very top of every page for shipping news, sales and notices. Up to 8 announcements. Default scheme: Scheme 4.

Layout One message at a time, Scrolling marquee: Rotate messages one by one, or scroll them all in a loop.
Rotate automatically default on: For One message at a time. Always off for visitors who prefer reduced motion.
Seconds per message 3 to 10, default 5: How long each message stays.
Show arrows default on: Previous and next arrows for the rotating layout.
Seconds per loop 10 to 60, default 30: Speed of the Scrolling marquee. A higher number is slower.

Block: Announcement. Text (rich text, links allowed) and an optional Link that makes the whole message clickable.

The top of every page. On the home page Rail shows a giant wordmark masthead (your store name in huge type); once the visitor scrolls, a compact floating dock appears at the bottom of the screen with the logo, a Shop button, pinned departments, a menu button, search, account and bag. On other pages a compact bar is shown at the top. Up to 20 blocks.

Color scheme default Scheme 1: Colors of the compact bar, dock and panels.
Giant wordmark masthead Home page only, All pages, Off (compact bar everywhere): Where the giant masthead shows. Choose Off if you prefer a normal compact header everywhere.
Masthead background Accent color, Scheme background: Fill the masthead with the scheme's accent color (pink by default) or its plain background.
Wordmark size 10 to 26 vw, default 20: Size of the store name in the masthead. Long names shrink automatically to fit.
Show the dock After scrolling past the header, Always: When the dock appears.
Dock position on large screens Bottom center, Bottom left: Where the dock sits on desktop. On phones it spans the bottom of the screen.
Show the dock on large screens default on: When off, a compact bar stays fixed at the top on large screens instead, and the masthead page scrolls normally.

Set your logo under Theme settings > Logo and favicon. Without a logo, the store name is used as a wordmark.

Header blocks

Menu max 1: Menu: choose a navigation menu (default main-menu). Supports dropdowns up to three levels deep and works with the keyboard.
Department max 8: A featured collection shown in the dock's departments panel. Settings: Title (defaults to the collection title), Collection, Link (overrides the collection link), Menu (links listed beside the department), Image (defaults to the collection image) and Show as a link in the dock.
Search max 1: The search button. It opens the search panel with predictive results when Enable search suggestions is on.
Account max 1: Sign-in and account button. Setting: Customer account menu.
Cart max 1: The bag button with an item count. It opens the cart drawer or the cart page, depending on Cart type.
Country / language max 1: Country/region and language selectors (Show country/region selector, Show language selector). Nothing is shown when your store has a single market and a single language. See Languages and markets.
App app blocks: Space for apps that add header features.

The bottom of every page. Default scheme: Scheme 6 (black). Up to 12 blocks.

Show giant wordmark default on: A huge version of your store name across the bottom.
Wordmark text: Leave empty to use the store name.
Wordmark size 12 to 30 vw, default 26: Long names shrink automatically to fit.
Show policy links default on: Links to your store policies in the bottom bar.
Show Follow on Shop default on: Shows Shopify's Follow on Shop button. Needs Shop Pay enabled for the store.

Footer blocks

Newsletter max 1: Email signup. Settings: Eyebrow, Heading, Text, Button label and Small print. Signups are added to your Shopify customers with the tag newsletter.
Link list: A column of links. Settings: Heading and Menu (default footer). Add one per column.
Text: A short text column. Settings: Heading and Text.
Social links max 1: Icons for the profiles you entered under Theme settings > Social media. Setting: Heading.
Payment icons max 1: Shows the payment methods enabled in your store settings.
Country / language max 1: Settings: Heading (default "Region and language"), Show country/region selector, Show language selector.
App: Space for app blocks.

Home page sections

The default home page is built from these sections, in this order: Masthead hero, Statement, Rail, Departments, Shelf, Editorial split, Wall, Fitting room, Mirror, Fine print and Newsletter. Reorder, remove or add more of them freely.

A full-width opening with a big heading and your photo in an arch window. Up to 4 blocks. Use Heading level: H1 on the first section of the home page only.

Image, Mobile image, Second image: A portrait photo (3:4 or taller works best). Mobile image is optional and shown on phones instead. Second image is used by the Two arches layout on large screens.
Layout Centered arch, Off-center arch, Two arches: How the arch windows are arranged.
Media shape Arch, Pill: Shape of the photo window.
Heading size 60 to 120 %: Scales the hero heading.
Text position Left, Right: Where text and buttons sit on large screens.

Blocks: Heading (the text, line breaks are kept, plus Heading level H1 or H2), Text (Eyebrow and Text), Buttons (first and second button label and link) and Price tag (product) (a product that hangs on the arch as a swinging tag and links to it).

Statement

A giant ticker of words and small photo pills, like a billboard. Up to 16 blocks. Default scheme: Scheme 5.

Text size 60 to 140 %: Size of the words.
Scroll sideways default on: Off, or when the visitor prefers reduced motion, the words wrap and stand still.
Direction Left, Right: Scroll direction.
Time per loop 10 to 90 s: Longer is slower.

Blocks: Word (Text and Style: Solid, Italic accent or Outline) and Image chip (a decorative image shown in a pill between the words).

Rail

The signature section: products hang on a horizontal rail that shoppers drag or swipe. Default scheme: Scheme 2.

Eyebrow, Heading, Italic accent: The title is Heading followed by Italic accent in the accent font, for example "On the rail this week".
Show view all link, View all label: A link to the collection. Leave the label empty to show the collection's product count.
Collection and Products to show 4 to 24, default 8: The collection to display and how many products.
Second collection: Add a collection to hang a second rail underneath.
Media shape Arch, Pill, Rounded rectangle: Shape of the product photos in this rail.
Gentle swing default on: Hangers sway slowly. Off when visitors prefer reduced motion.

Blocks: Product (pin) (pinned products hang first, before the collection) and Rail end card (max 1: Heading, Text, Link; the link defaults to the collection).

Departments

A row of collections shown as arch or pill windows, ideal as a shop-by-category band. Up to 12 blocks.

Heading: Section title.
Columns on desktop 2 to 5: Number of columns on large screens.
Columns on mobile 1 column, 2 columns: Number of columns on phones.
Image shape Arch, Tall arch, Pill, Upside-down arch, Rounded square: Shape of each window.
Label position On the image, Below the image: Where the collection name sits.
Show product count default on: Shows how many products each collection has.

Block: Collection. Collection, Image (defaults to the collection image) and Label (defaults to the collection title).

Shelf

Shoes standing on plinths, arranged on one to three shelves. Default scheme: Scheme 4.

Eyebrow, Heading, Italic accent, Show view all link, View all label: Title and link, same as Rail.
Collection: The collection to show.
Shelves 1 to 3, default 2: Number of shelves.
Products per shelf 3 to 5, default 4: Phones show two across.
Show prices default on: Show or hide prices under the shoes.
Plinth tone Soft, Light, Deep: Color tone of the plinths.

Blocks: Product (pin) (stand first, before the collection) and Shelf label (max 3; labels are used in order, one per shelf, for example "Heels").

Editorial split

An image beside a story, good for lookbooks, journal posts or a campaign. Up to 8 blocks.

Image: The photo.
Image shape Pill, Arch, Tall arch, Upside-down arch, Rounded square, Soft rectangle: Shape of the photo window.
Image side Left, Right: Which side the image is on.
Heading overlaps the image default on: On large screens the heading overlaps the photo.

Blocks: Caption, Heading (with Size Medium or Large), Accent line, Text and Button (Label, Link, Style Solid, Outline or Accent).

Wall

Bags hang on hooks in front of a pegboard. Default schemes: Scheme 6 for the wall, Scheme 1 for the tiles.

Eyebrow, Heading, Italic accent, Show view all link, View all label: Title and link, same as Rail.
Collection and Products to show 3 to 20, default 8: The bags to show.
Columns on desktop 3 to 5: Tablets show three, phones two.
Hook style Dot, Ring: The pegboard holes behind the bags.
Tile color scheme: Colors of the round windows the bags sit in.

Blocks: Product (pin) (hang first) and Collection link (max 1: Label and Link; the link defaults to the collection).

Fitting room

A complete look on one photo. Shoppers swap the top, bottom, bag or shoes and add the whole look to the bag in one tap. Default scheme: Scheme 3.

Eyebrow, Heading, Bundle message: Title text, and a line under the add button.
Show total default on: Shows the total price of the look.
Image position Left, Right: Side of the look photo.
Piece color scheme, Total bar color scheme: Colors of the piece cards and the total bar.

Blocks: Look image (max 1: Image and Look name), Product slot (max 5: Slot label such as Top, Bottom, Bag or Shoes, the Product, and optional Swap options, a collection whose products shoppers can swap in), Note (a Style note) and App blocks.

Good to know

Pieces with sizes are chosen by the shopper on the piece. The total is calculated in the shopper's browser and may differ slightly in formatting from Shopify's prices, but the cart always uses Shopify's real prices.

Mirror

A wall of customer photos with handles, like a social feed. Up to 12 blocks. Default scheme: Scheme 2.

Heading, Subheading: Title and a line such as "tag @yourbrand to land on this wall".
Columns on desktop 3 to 6, default 5: Number of columns.
Show handles default on: Shows the @handle under each photo.

Block: Photo with handle. Photo, Handle, Linked product (makes the photo a link to a product), Shape (Arch, Pill, Upside-down arch, Rounded square) and Height (Tall, Short). Only add photos you have permission to use.

Fine print

A row of short columns for shipping, returns and payment promises. Up to 8 blocks.

Heading, Columns on desktop 2 to 4, Alignment Left, Center: Section title and layout.
Show top line default on: A line above the columns.

Block: Column. Big number (shown in the heading font, for example $150 or 30d), Icon (None, Delivery, Returns, Payment, Check, Lock, Hanger), Image (replaces the icon), Title, Text, Link label and Link.

A standalone email signup band. Up to 4 blocks. Default scheme: Scheme 4.

Setting: Alignment (Left, Center). Blocks (max 1 each): Heading, Text and Email form (Button label, leave empty for the default, and Small print). Signups are added to your Shopify customers with the tag newsletter.

Content sections

These sections work on any page.

Rich text

A centered block of headings, accent lines, text and buttons. Up to 8 blocks.

Settings: Alignment (Left, Center) and Content width (Narrow, Medium, Wide). Blocks: Heading (with Size Medium or Large), Accent line, Text and Buttons (two buttons, each with label, link and style: Solid, Outline or Accent).

Collapsible content

Questions and answers that open and close, with an optional image. Good for returns, shipping and care. Up to 12 blocks.

Settings: Heading, Image (optional, beside the rows), Image side (Left, Right), Image shape (Arch, Tall arch, Pill, Rounded square). Block: Row with Heading, Content and Open by default.

Video

A video with a cover image. Nothing from YouTube or Vimeo loads until the visitor presses play.

Settings: Heading, Video (upload) or Video link (used when no video is uploaded), Cover image, Video title (describes the video for screen readers; please fill it in), Format (Landscape 16:9, Portrait 4:5, Square), Shape (Rounded, Arch, Pill, Soft rectangle) and Width (Full page width, Narrow).

Featured product

One product with its buy box, placed on any page, for example a drop on the home page.

Product, Eyebrow, Heading: The product and the title text.
Layout Carousel with thumbnails, Stacked column: How the product media is arranged.
Media position, Media shape, Media ratio: Side of the media, window shape (Arch, Alternating windows, Rounded rectangle, Plinth) and ratio (Tall 5:6, Portrait 4:5, Square, Match first image).
Open images in a lightbox, Show hang tag: Zoom on click, and the decorative hanging tag.

Blocks are the same as on the product page: Title, Price, Badges, Variant picker, Quantity, Buy buttons, Description, Pickup availability, Share, Text, Custom Liquid and App blocks. See Product page blocks.

Contact form

A contact form beside your contact details and quick answers. Used on the Contact page template. Up to 12 blocks.

Settings: Intro text, Color scheme and Form color scheme. Blocks: Contact detail (Label, Value, optional Link such as a mailto: link) and Question (Question and Answer). Messages arrive in your store's customer email under Contact form.

Custom Liquid

Adds your own Liquid, HTML or an app snippet. Settings: Custom Liquid, Full width (removes the page margins around your code). Available on every template and in the footer group.

Duplicate your theme first

Custom code is outside the scope of Rail support. Before you add or edit any code, duplicate your theme (Online Store › Themes › … › Duplicate), and consider hiring a Shopify Partner for custom work. See the support policy.

Product recommendations

Related products chosen by Shopify, shown on the product template. Recommendations improve as your store gets orders.

Settings: Heading, Products to show (2 to 10, default 8), Card media shape (Arch, Pill, Plinth, Round on a hook, Rounded rectangle).

Main page sections

Each page type has a main section that does the heavy lifting.

Product

The product page. Full guide with all blocks on Product page.

Collection page

Collection pages with filters, sorting, the Grid and Rail views and promo cards. Full guide: Collections, filters and search.

Collection list page

The page that lists all your collections.

Settings: Sort collections by (Alphabetically A-Z, Product count high to low or low to high, Date newest or oldest first), Collections per page (6 to 48, default 12), Columns on desktop, Columns on mobile, Show product count.

Search page

Search results with filters and sorting. Full guide: Search.

Cart items and Cart footer

The cart page. Full guide: Cart.

Blog

The page that lists blog posts. Default 9 stories per page.

Layout Featured first story, Grid only: The featured story shows only on the first page.
Columns on large screens 2 to 4, Image shape Mixed, Arch, Pill, Upside-down arch, Rounded square, Stories per page 6 to 24: Grid layout and paging.
Show tag filters, Show excerpt, Excerpt length (words), Show date, Show author, Show reading time: Which details appear on each story. Excerpt length is 10 to 50 words.

Article

A single blog post. It is made of blocks you can reorder: Title (Show breadcrumb), Author and date (Show author, Show date, Show reading time), Featured image (Image shape: Arch, Pill, Rounded rectangle), Content, Share (Show Pinterest, Show Facebook, Show X) and Tags. Comments appear when they are enabled on the blog in Shopify.

Page

Standard pages such as About or Size guide. Settings: Content width (Narrow, Wide) and Alignment (Left, Center). The Contact page template combines this section with a Contact form.

404 page

Shown when a link is broken. Settings: Heading, Text, Show search. Block: Quick link (up to 6, each with Label and Link).

Password page

Shown while your store is password protected. Settings: Top label, Store name size (Large, Medium; use Medium for long store names), Show email signup, Button label, Fine print. Your logo (or store name) and your password message from Shopify are shown automatically.

Gift card page

The page a customer sees when they receive a gift card. It shows the code with a copy button, the balance, a QR code, a Start shopping button and a print button. It has no theme editor settings; its text comes from the theme's built-in text and your logo.

App blocks

Rail supports app blocks in the Header, Footer, Product, Featured product, Fitting room and Cart footer sections. If an app offers a block, choose Add block in those sections and pick it under Apps. Apps that work through an app embed are turned on under the editor's App embeds icon.