VANTA — Getting Started

VANTA v1.1.0 documentation

Documentation home · Getting started · Commerce OS · Catalog & product setup · Integrations · Performance, SEO & accessibility · Troubleshooting · Buyer/owner guide · Changelog · Support

VANTA — Getting Started

This guide takes a new merchant from theme installation to a usable storefront without editing Liquid, CSS or JavaScript.

1. Install safely

  1. Upload VANTA as a new theme and keep the current live theme published while you configure VANTA.
  2. Open Online Store → Themes → VANTA → Customize.
  3. Do not replace your live theme until products, navigation, policies, localization and checkout settings have been tested.

2. Brand foundation

  • Theme settings → Colors: background, surface, primary text, muted text, borders and accent.
  • Brand: upload a favicon and configure your store logo in the header.
  • Typography: choose Shopify-hosted fonts. VANTA uses font-display: swap.
  • Layout: adjust page width and corner radius.

3. Navigation

Create your menus in Shopify Navigation, then assign them to VANTA Header and Footer. Keep primary navigation concise and place large secondary structures in dropdown groups.

4. Homepage

Configure the Cinematic Hero first. Use a high-quality Shopify image or uploaded Shopify video. The hero image is automatically prioritized when it is above the fold. Connect the Featured Collection to your main merchandising collection and optionally add Featured Product, editorial storytelling, FAQ and newsletter sections.

5. Products

VANTA product pages use rearrangeable blocks. Recommended order: Vendor → Title → Price → Description → Buy buttons → Fit Assistant → Complete the Set → Shipping/returns → App blocks. See the Catalog & Product Setup guide for variants, preorder, gift cards and sold-out states.

6. Search and filters

Configure product filters in Shopify Search & Discovery. VANTA reads Shopify storefront filters and enhances them with AJAX replacement while preserving server-rendered results for SEO and no-JavaScript fallback.

7. International selling

Configure countries, currencies and languages in Shopify Markets. VANTA displays Shopify-native country/language selectors; currency conversion remains controlled by Shopify.

8. Before launch

  • Replace demo content and images with merchant-owned content.
  • Test mobile, tablet and desktop.
  • Test an in-stock product, a product with variants, a discounted product, a sold-out product, a preorder product and a gift card.
  • Verify cart, accelerated checkout, policies, contact page, taxes and shipping rates.
  • Run Lighthouse on home, collection and product pages using realistic content.