Getting Started - OneOnic Solutions
View Categories

Getting Started

Table of Contents

Welcome to Sneax — an ultra-modern, animation-driven, and conversion-engineered Shopify theme crafted specifically for footwear brands, sneaker boutiques, athletic footwear labels, and streetwear stores.

From high-heat limited-edition sneaker drops to detailed footwear product pages equipped with sizing guides, sticky add-to-cart bars, and shoe attribute breakdown bars, Sneax is designed to showcase your kicks with bold energy and turn store visitors into loyal buyers.

This guide will walk you through your initial setup, navigating the Shopify Theme Editor, utilizing our modular sections and theme blocks, and configuring global theme settings.

1. Theme Installation #

Getting Sneax running on your Shopify store is quick and seamless:

  1. Log in to your Shopify Admin.
  2. Go to Online Store → Themes.
  3. Under the Theme library section, click Add theme → Upload zip file.
  4. Select your sneax.zip package from your computer and click Upload file.
  5. Once uploaded, Sneax will appear in your theme library. You can preview it, customize it in draft mode, or click Publish whenever you are ready to make Sneax your live storefront.

2. Theme Editor Overview #

To start designing your sneaker store, click Customize next to your Sneax theme. The Shopify Online Store 2.0 Theme Editor provides a 3-panel workspace:

  • Left Sidebar (Structure & Hierarchy): Displays your current template (Homepage, Product, Collection, Cart, etc.), active sections, and individual blocks. You can drag and drop sections and blocks to reorder them on the fly.
  • Center Screen (Live Interactive Preview): Shows a real-time, responsive preview of your store. You can interact with slideshows, swatches, and drawers directly, or switch between Desktop, Mobile, and Full Screen views at the top.
  • Right Sidebar (Settings Panel): Whenever you click any section or block on the left panel, the right panel dynamically loads all its customizable options (e.g., color schemes, image pickers, typography alignment, padding, and sneaker-specific toggles).

3. Page Sections in Sneax #

Your pages are built using modular, stackable Sections. Sneax comes packed with over 35+ specialized sections designed to tell your footwear brand’s story and drive conversions without needing expensive third-party apps.

Key Showcase Sections Include: #

  • Slideshow: Hero carousel featuring kinetic parallax transitions, custom review rating badges, and large background watermark typography.
  • Circle Slider: An interactive rotating circular turntable that displays featured kicks along an orbital ring.
  • Showcase: High-impact hero section combining background video clips, sneaker hotspot pins, and key performance metrics.
  • Featured Collection: Tabbed collection grids or carousels with smooth product card hover animations.
  • Review Summary: Footwear attribute breakdown bars giving shoppers instant visual ratings on sneaker comfort, true-to-size fit, width, and craftsmanship.
  • Before / After Image: Interactive draggable comparison slider (ideal for sneaker restorations, waterproof demonstrations, or day-to-night styling).
  • Product Bundle: Cross-sell footwear packages (e.g., sneakers + care kit + socks) with bundled discounts.
  • Shop The Look: Lifestyle footwear photography featuring clickable, shoppable hotspot markers.
  • Highlight Text: Bold editorial statement section featuring embedded mini-image badges and live numerical counters.
  • Countdown Timer: Urgency banner for upcoming sneaker drops and flash sales paired with quick buy buttons.
  • Video Testimonials & Reels: Mobile-first, swipeable customer video reviews supporting MP4 files and external video links.

NOTE

To add any of these sections to any template, scroll to the bottom of the left sidebar, click Add section, and select your desired section from the list.

4. Modern Theme Blocks & Nested Content #

Sneax is built on Shopify’s latest Theme Blocks architecture. Blocks are no longer rigid—they are flexible, modular components that you can nest and rearrange inside sections.

Inside sections like the Slideshow, Main Product, or Multicolumn, you have access to dedicated blocks:

  • Group Block: A flexible container block that lets you group titles, subtitles, text, and buttons together with custom alignment controls.
  • Title & Subtitle Blocks: Custom heading blocks with independent HTML tags (h1 through h6), custom typography styling, and text alignment.
  • Text / Description Block: Rich text blocks for product narratives, material descriptions, and brand taglines.
  • Link / Button Block: Call-to-action buttons with customizable styling, outline/solid modes, and custom URLs (e.g., “Shop New Drops”).
  • Countdown Block: Micro-timers that can be placed directly inside slides or product blocks.
  • Slide Block: Contains independent desktop and mobile image selectors, focal point controls, review rating badges, and background watermark text.

5. Global Theme Settings #

To ensure consistent branding, colors, and functionality across every page, open Theme settings (the Gear icon ⚙️ at the bottom-left of the theme editor):

  • Logo & Favicon: Upload your brand logo with independent width controls for Desktop and Mobile, and set your browser tab favicon.
  • Colors (Color Scheme Builder): Create and edit unified color schemes with full control over backgrounds (solid or gradient), text, buttons, borders, and accent highlights.
  • Typography & Font Scaling: Select distinct font families for headings and body copy, with responsive font-scaling sliders to dial in the perfect streetwear or luxury footwear aesthetic.
  • Layout: Adjust the maximum page width container (from standard 1200px up to an expansive 2400px ultra-wide layout).
  • Product Cards & Swatches:
    • Choose variant swatch styles: Circle, Square, or Default.
    • Enable the Quick View modal for frictionless browsing.
    • Turn on the animated Scrolling Text Marquee directly on product cards to highlight “NEW DROP” or “LIMITED EDITION”.
  • Badges: Customize the position (top-left, top-right, etc.), background colors, and text for Sale badges (including percentage discount calculation) and Sold Out badges.
  • Search: Enable instant Predictive Search with live product, collection, and blog suggestions, plus built-in browser Voice Search with microphone support.
  • Cart (Drawer or Dedicated Page): Choose between a smooth slide-out Cart Drawer or a traditional cart page. Configure your Free Shipping Goal Bar with dynamic threshold amounts and progress notifications, order notes, and in-cart coupon code inputs.
  • Breadcrumb Navigation: Toggle clean breadcrumbs across collection and product pages to enhance site navigation and SEO.