> For the complete documentation index, see [llms.txt](https://sitesbyseth.gitbook.io/sitesbyseth-docs/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://sitesbyseth.gitbook.io/sitesbyseth-docs/showcase/pages.md). # Pages Beyond the story deck, Showcase ships every page a real store needs. Here's what each one does and how to set it up. ## Cart drawer The cart is a full-screen (or side-panel) drawer that opens from the cart icon in the header — visitors never leave the story. It's built from **blocks**, so every cart feature is something you add, configure, or remove: * **Milestone bar** — the progress bar above the items: free shipping, free gift, plus up to 3 custom spend milestones on one track. * **Free gift** — a teaser row showing the locked gift and how to unlock it. Once unlocked, the gift becomes its own cart line ("Added automatically", no remove button, price shows **Free** when the product is $0). * **Extra milestone** — additional custom milestones beyond the bar's built-in three (up to 4 extra blocks). * **Upsells** — "Complete the fit": up to 6 products from a collection, with one-tap Add for single-variant products. Items already in the cart (and the gift product) are filtered out automatically. Plus section settings for layout (full-screen card vs. side panel, corner radius, edge spacing, background dim), custom colors, an order note, a taxes note, custom empty-cart text, and an optional **checkout agreement** checkbox that locks the checkout button until ticked. 👉 To edit it: **Customize → Theme settings area of the sidebar → Cart drawer section** (it's listed on every page). Full setting-by-setting reference: [Sections → Cart drawer](/sitesbyseth-docs/showcase/sections/cart-drawer.md). ## Cart page The classic `/cart` page still exists (some visitors type the URL; some apps link to it). It lists line items with quantity steppers and remove links, an optional order note (toggle in **Theme settings → Cart → Show order note on the cart page**), subtotal, and checkout. It has no section settings of its own — it inherits your colors and fonts. ## Contact 1. In your Shopify admin, go to **Online Store → Pages → Add page**. 2. Name it (e.g. "Contact"), and on the right, set **Theme template** to **contact**. 3. Save, then add it to your menu (**Online Store → Navigation**). The page renders a form (name, email, optional phone, message) that emails submissions to your store's sender email. In the editor you can set an **Eyebrow** (default "SUPPORT"), a **Heading** (falls back to the page title), and **Intro text** (falls back to the page content). ## Blog and articles Standard Shopify blog, Showcase-styled: the blog page is a 3-column grid of article cards (image, title, date), 12 per page; the article page is a clean, centered reading column with a breadcrumb back to the blog. Manage posts under **Online Store → Blog posts** — there's nothing theme-side to configure. ## Search The search page (`/search`) has a search field, a result count, and a 4-column grid — products render as product cards; pages and articles as simple title + excerpt entries. Visitors reach it from the **search field inside the menu drawer** (toggle it via the Header section's **Show search in menu** setting). ## 404 A minimal "404 / Page not found" screen with a **Back to home** button. Nothing to configure — it just works and stays on-brand. ## Customer accounts Showcase includes styled classic account pages: **log in** (with inline password recovery), **register**, **account overview** (order history table), **order detail**, **addresses** (add/edit/delete), plus reset and activation pages. Turn accounts on under **Settings → Customer accounts** in your Shopify admin. When enabled, an account link appears in the footer of the menu drawer (Header section → **Show account link**). ## Gift card When someone buys a Shopify gift card, the recipient's link opens a clean card page: your store name, the balance, the code in a dashed frame, and a Continue shopping button. Expired or disabled cards say so. No setup needed. ## The Lookbook The lookbook is Showcase's campaign-imagery showcase: a 3D deck of photos, each with up to **three "Seen on" hotspots** pinned to products. Tapping a hotspot opens a popup with the product's photo, price, an **Add to cart** button (single-variant products) or **View product** link. On the homepage the Lookbook sits right after the story deck and even gets its own auto-added chip on the side rail. To set it up: 1. **Customize** → make sure you're on the homepage → click the **Lookbook** section. 2. Set the **Eyebrow** (default "THE LOOKBOOK"), **Heading** (default "Worn in the wild"), **Background color**, and **Navigation style** (`Arrows` / `Dots` / `Arrows and dots`). 3. Add a **Look** block per campaign image and upload the **Image**. 4. For each of the three **Seen on spots**: pick a **Product**, then drag the **Horizontal position** and **Vertical position** sliders (0–100%) until the dot sits on the item in the photo. Leave a spot's product empty and that dot doesn't render. To hide the lookbook, untick **Show lookbook** — the screen *and* its rail chip disappear completely. Deleting all Look blocks hides it too. 💡 The Lookbook section can also be added to other pages (it appears in the **Add section** list on JSON-templated pages) if you want a standalone campaign page. Full reference: [Sections → Lookbook](/sitesbyseth-docs/showcase/sections/lookbook.md). --- # Agent Instructions This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com. ## Querying This Documentation If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question. Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter: ``` GET https://sitesbyseth.gitbook.io/sitesbyseth-docs/showcase/pages.md?ask=&goal= ``` `ask` is the immediate question: it should be specific, self-contained, and written in natural language. `goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal. The response will contain a direct answer to the question and relevant excerpts and sources from the documentation. Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.