Sections
Chapter 4 of the Loot user guide.
Add a section in the theme editor with Add section. Most sections share a section heading: a Kicker (the small tilted pop sticker above the heading) with a Kicker icon, a Heading, sometimes a Body, and a Link label and Link that end in an arrow tile. Background is Page, Alternate band and, on some sections, Accent. A section that needs a product or collection shows placeholder cards until you choose one, so choose one before you publish. Sections whose content is empty, such as a collection with no products or a drop calendar with no drops, take no space on your storefront.
Home page and content sections
| Section | What it's for | Key settings |
|---|---|---|
| Hero | The big opening block | Layout: Burst (a tilted blister card on your accent color with sunburst rays, a back card peeking out and a price starburst), Split (the image tilted on a bright panel at the right edge) or Image (a full-width photo with the text on a card, never on the photo). Kicker, Heading, Highlight (a phrase from the heading drawn on a tilted sticker, such as "every Friday."), body and two buttons. Image (cut-outs on a transparent background look best; empty uses the product's), Back image (Burst), Product (adds its name, edition and lowest price, and links the card), Sticker text (empty shows the lowest price; a | splits off a small first line, as in Game of|the month), Chase chip (Burst) and Text card position (Image). Count down to: Nothing, The product's release date, or A date and time (End date, End time, Time zone), with a Countdown label. Up to four Stat blocks (icon, value and label, such as "2–4 players") show as tiles under the text. |
| Slideshow | Several heroes in turn | Up to six Slide blocks, each with Layout (Burst or Split), kicker, heading, highlight, text, two buttons, Image, Product and Sticker text. Rotate slides automatically (off) and Change slides every (7s, 5 to 10). Shoppers get a pause button, and slides never rotate for visitors who prefer reduced motion. |
| Collection list | Fandom tiles: one per collection, with its image in a tinted tile | Layout: Row (six across, a swipe strip on phones) or Cards (three across, two on phones). Collections (empty lists every collection) and Collections to show (6, 2 to 24). The presets Collection list and Collection cards start you on each layout. |
| Featured collection | A grid of blister cards | Collection, Products to show (8, 2 to 12), Layout (Grid or Carousel), Columns on desktop (3, 4 or 5) and Columns on mobile (1 or 2). The link defaults to the collection. |
| Featured product | One product with its buy box | Product, Background (Page, Alternate band or Accent), Enable image zoom, the pre-order settings (chapter 6) and the product blocks (Product metadata, Title, Product vendor, Price, Inventory, Variant picker, Description, Buy buttons, Product link, and app blocks) |
| Drop calendar | Upcoming releases with countdowns and Remind me | See chapter 9 |
| Set tracker | A series or wave as a checklist shoppers tick off | See chapter 10 |
| Image with text | A story beside an image | Image, Image tile (Plain, or Dots: a halftone dot pattern that cut-out images float on), Media position (Left or Right), Sticker text (a starburst on the image corner, such as Grade|9.5), kicker, heading, body (bulleted lists show as tick tiles) and a button. Background defaults to Alternate band. |
| Bundles | Up to three bundle tiers, side by side | Each Bundle: Tier ("Starter pack"), Tier color (a rarity color or Accent), Product (a bundle product you sell; its compare-at price makes the "Save $40" chip), Tagline, What's inside (one item per line), Button label, and Highlight this bundle with a Highlight sticker ("Most picked"). |
| Shop the shelf | A photo of a shelf or table with pins on the things you sell | Image (never cropped, so pins stay put). Up to twelve Hotspot blocks: Product (adds its price and a quick add), Label, Horizontal position and Vertical position (0 to 100%) and Detail. Each pin opens a mini blister card; on phones the cards are listed under the photo. |
| Trust strip | Up to six short promises with icons | Kicker, heading, Columns on mobile (1 or 2). Each Item: Icon (21 icons, from Box and Truck to Dice, Meeple and Puzzle piece), Heading, Text and Link. State only terms your store actually offers. |
| Licensed brands | Up to twelve brand or licence logos | Logo colors (Original, or Monochrome in one flat color; use transparent logos), Logo height (40px, 24 to 56), Layout on mobile (Wrap or Scroll). Each Logo needs an Image and a Company name (a logo without a name isn't shown), with an optional Link and Quote. |
| Rich text | Free text and buttons | Alignment (Center or Left) and Background (Page, Alternate band or Accent). Add Kicker, Heading, Text and Button blocks. |
| Section | An empty section you fill with blocks | Alignment and Background. Takes any theme block and app blocks. |
| FAQ | Questions and answers | Layout: Heading beside questions, or Heading above questions. Add Collapsible row blocks. |
| Newsletter | An email sign-up band | Heading ("Hear about drops first."), body, Button label ("Get drop alerts"), Note ("Unsubscribe any time."), Customer tag ("newsletter") and Background (Night, Accent or Alternate band) |
| Blog posts | Your latest articles | Blog (shows its newest articles) or Articles (picked by hand, in your order), Articles to show (3, 2 to 12) |
| Custom Liquid | App snippets or your own code | Liquid, Spacing (Regular, Tight or None) and Background |
Product page sections
| Section | What it's for |
|---|---|
| Product | The gallery and the buy box (chapter 6) |
| Product details | Two panels under the product: the Spec table ("Box details") and the Condition guide (chapters 6 and 8). Background: Page or Alternate band. |
| Set tracker | With Layout set to Strip and Set left empty, it shows the product's own set: "Complete the set" (chapter 10) |
| Product recommendations | A row of blister cards. Source: Shopify recommendations (with Recommendation type Related or Complementary) or Expansions (the product's custom.expansions, for a base game's "Expand this game" row; chapter 11). Products to show (4, 2 to 10) and Columns on desktop. The preset Expansions starts you on the expansions source. Complementary products come from the Search & Discovery app. |
| Quick order list | For B2B customers: every variant of a product in a table with quantity fields. Variants per page (25, 10 to 50) and Show SKU. |
Page sections
- Page: your page's content, with Show breadcrumbs, a kicker, Show the publish date and a facts panel (Facts panel heading, "At a glance") filled with Fact blocks (label and value, such as Open: Thu to Sun, 11 am to 6 pm).
- Contact form: kicker ("Ask the counter"), Form heading and Show order number field (on), with Menu column blocks (quick answers) and Text blocks (an icon, heading and text, such as your address) beside the form.
- My sets: chapter 10.
- Collection and Search: chapter 13. Blog and Article: your blog's article list (Show featured entry, Show tags, Articles per page) and article pages (blocks for breadcrumb, title, byline, featured image, content, tags and share).
- 404 page: heading "This page rolled a 1.", body, link and Show the requested address.
- Password: your "opening soon" page, with a heading and highlight, an optional countdown to your Opening date and a newsletter form (Button label "Tell me when").
Compare
Turn on Show compare checkbox in Theme settings › Product cards, create a page with the page.compare template and choose it as the Comparison page. Shoppers tick up to three products; a tray at the bottom of the screen shows their thumbnails and a Compare button. The Compare section shows them side by side with price, availability and the rows of its Spec table block; add Spec row blocks to compare your own metafields, such as scale or piece count.