> For the complete documentation index, see [llms.txt](https://docs.webexp.dev/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.webexp.dev/supra-shopify-theme.md).

# SUPRA Shopify Theme

- [SUPRA](https://docs.webexp.dev/supra-shopify-theme/supra.md): A stripped-back streetwear theme built around the drop — enter page, filmstrip, one-screen collection, and a password page that counts down.
- [Getting Started](https://docs.webexp.dev/supra-shopify-theme/supra/getting-started.md): Install SUPRA and get your store set up.
- [Installation](https://docs.webexp.dev/supra-shopify-theme/supra/getting-started/installation.md): How to upload SUPRA to your Shopify store.
- [First-Time Setup](https://docs.webexp.dev/supra-shopify-theme/supra/getting-started/first-time-setup.md): The settings and Shopify data SUPRA needs before it looks like the demo.
- [Going Live](https://docs.webexp.dev/supra-shopify-theme/supra/getting-started/going-live.md): What to check before you publish SUPRA.
- [Theme Settings](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings.md): Every global setting group in SUPRA.
- [Colors](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings/colors.md): The four colours the whole theme is built from.
- [Typography](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings/typography.md): Body and heading size.
- [Layout](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings/layout.md): Category list style on phones, and product card titles.
- [Logo](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings/logo.md): The shop mark, and how tall it is drawn.
- [Cart](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings/cart.md): What happens after someone adds to cart.
- [Shipping Note](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings/shipping-note.md): The small red line about shipping.
- [Clock](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings/clock.md): The live store clock under your logo.
- [Link Hover](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings/link-hover.md): How the accent fill behaves on navigation links.
- [Branding](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings/branding.md): The favicon, and the image shown when someone shares a link.
- [Social Media](https://docs.webexp.dev/supra-shopify-theme/supra/theme-settings/social-media.md): Your social links and how they display.
- [Sections & Features](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features.md): Every section you can add or configure in SUPRA.
- [Header](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/header.md): Centred logo, live clock, and how the header behaves on phones.
- [Enter Page](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/enter-page.md): The full-screen front door that covers your store until someone clicks through.
- [Filmstrip](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/filmstrip.md): The horizontal run of narrow product slivers.
- [Collection](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/collection.md): The one-screen grid with a category rail.
- [Featured Collection](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/featured-collection.md): A collection grid you can drop on any page.
- [Product](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/product.md): The product page, colourways, and the in-cart state.
- [Preview](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/preview.md): A look at what is coming, with nothing to buy on it.
- [Cart](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/cart.md): The cart page and the floating cart box.
- [Lookbook](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/lookbook.md): Editorial images with a full-screen viewer.
- [Mosaic](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/mosaic.md): A tight grid of product crops, and the way into the preview.
- [Image Banner](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/image-banner.md): A full-width image with a heading and button.
- [Rich Text](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/rich-text.md): Headings, paragraphs and buttons in the page column.
- [FAQ](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/faq.md): Questions that fold away, one at a time.
- [Contact](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/contact.md): The contact form.
- [Stores Grid](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/stores-grid.md): Store interiors in a grid.
- [Random Product](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/random-product.md): Sends a visitor to a random product.
- [Search](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/search.md): Predictive search and the results page.
- [Footer](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/footer.md): Navigation, link columns, mailing list and the bottom row.
- [Announcement Bar](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/announcement.md): The thin bar above the header.
- [Popup](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/popup.md): The mailing list, in a box over the page.
- [Policies](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/policies.md): One page listing the policies you have written.
- [Password Page](https://docs.webexp.dev/supra-shopify-theme/supra/sections-and-features/password.md): The closed-store page — countdown, enter button, background media, and app form embeds.
- [Metafields](https://docs.webexp.dev/supra-shopify-theme/supra/metafields.md): The three product metafields SUPRA reads.
- [Colorways](https://docs.webexp.dev/supra-shopify-theme/supra/metafields/colorways.md): Link separate products together as colourways on the product page.
- [Colorway Name](https://docs.webexp.dev/supra-shopify-theme/supra/metafields/colorway-name.md): The colour name printed under the product title.
- [Custom Badge](https://docs.webexp.dev/supra-shopify-theme/supra/metafields/badge.md): A small corner note on collection tiles.
- [Pages & Templates](https://docs.webexp.dev/supra-shopify-theme/supra/pages-and-templates.md): What each Shopify template looks like in SUPRA, and which ones need a page.
- [Customer Accounts](https://docs.webexp.dev/supra-shopify-theme/supra/customer-accounts.md): Login, register, account and order pages.
- [Advanced](https://docs.webexp.dev/supra-shopify-theme/supra/advanced.md): Editing the code, and the things worth knowing before you do.
- [FAQ & Troubleshooting](https://docs.webexp.dev/supra-shopify-theme/supra/faq-and-troubleshooting.md): Things that look like faults but usually aren't.