Reference
Templates
| Template | Used for |
|---|---|
| Home | The homepage; fully section-based |
| Product | Product pages; block-based |
| Collection | Collection pages with banner, filters, grid |
| Collections list | The “all collections” page |
| Search | Search results (products, pages, articles) |
| Blog & Article | Your journal and individual posts |
| Page | Standard content pages |
| Page · Story | Editorial About page (page.story) |
| Page · Contact | Contact page with form (page.contact) |
| Cart | Full cart page (the drawer is the primary UX) |
| Customer templates | Login, register, account, order, addresses, reset/activate |
| Gift card | Gift-card display with QR |
| 404 & Password | Not-found and store-password pages |
| llms / llms-full / agents | Machine-readable AI surfaces |
Accessibility
- Semantic HTML with proper landmarks and a skip-to-content link.
- Full keyboard operation for menus, drawers, the search panel, and the media lightbox, with visible focus states.
- Respects
prefers-reduced-motion— animations and the smooth scroll back off. - Colour schemes are yours to set; aim for sufficient contrast between text and background.
Performance
Citera is built lean: vanilla JavaScript, no framework, and no external font or script CDNs, so there’s little to slow the page down. To keep your store fast:
- Upload appropriately sized images; the theme serves responsive sizes from them.
- Keep the hero image well-compressed — it’s the largest paint on the homepage.
- Prefer native and Shopify-hosted features over heavy third-party apps.
Browser support
The latest versions of Chrome, Safari, Firefox, and Edge, on desktop and mobile. Citera uses modern, widely supported CSS and JavaScript and degrades gracefully where a feature isn’t available.
Changelog
| Version | Notes |
|---|---|
| 1.0.0 | First release. Full section library, block-based product page, colour swatches, metafield-driven specs and directions, video & 3D media, predictive search, faceted collections with auto-filled banner, cart discounts and accelerated checkout, Markets selector, classic customer accounts, gift card with QR, and the AI-visibility surfaces (JSON-LD, llms.txt / agents.md). |
Frequently asked questions
Do I need to know code to use Citera?
No. Every page is built from sections and blocks in the theme editor. The only optional technical step is creating product metafields, done in admin, not in code.
Why do all my products show the same specs or directions?
Those blocks fall back to shared section content until you add per-product
metafields. Fill custom.specs and custom.directions on each product. See
Product metafields.
My colour swatches aren’t showing.
Check that the option is named one of your swatch option names (Color by
default); that the colour has a native swatch or a colour-map entry; and that
swatches are enabled for cards / the product page.
The country/language selector isn’t in my footer.
It appears only when your store sells in more than one country or language. Configure Shopify Markets and it shows automatically.
How do I add a filter to a collection?
Filters are managed by Shopify’s Search & Discovery app. A Color filter built from a product option renders as swatches in Citera.
Do video and 3D models work on every product?
Yes — add them in the product’s Media area. They render below the image gallery. No product is required to have them.
Can I use Citera for a store that isn’t supplements?
Yes. The design and structured data suit any catalogue; the wellness demo content is a starting point you replace with your own.
Will updating the theme lose my content?
Your content lives in Shopify, not the theme files. Follow Shopify’s theme-update flow to move settings to a new version.
Support
Something not behaving as described here? Reach the Citera team through the support channel on the theme’s Shopify Theme Store page. Include your store URL and a short description of what you expected versus what you saw — that gets a fast, specific answer.