Themes Services Help Center
Home Help Center Digital

Digital Documentation

Header Group

This theme provides various header layout options. You can customize the search promo and add two types of Mega Menu. Additionally, a light header with a blurred background and an overlay header can be enabled in sections where available.

Mega Menu

To add a Mega menu, make sure that the main menu link has sublinks, and then follow these steps:

  1. Add the Mega Menu to the Header.
  2. Type the exact name of the link in the Trigger field.

To avoid issues in stores with multiple languages, keep the {trigger} untranslated.

In this theme, you can use a predictive search. It is enabled by default, but you can disable it in the Theme settings > Search.

You can also enable the Search promo block in the Header settings, which appears before the user starts typing. This block can display two types of information: collections and products.

To manage search results, go to the Search settings within the Search & Discovery app.

Overlay Group

Notification Banner

In the Notification Banner settings, you can change layout, add image, texts, edit banner position, change open and exit animations and options.

You can also use this banner as a button-trigger for opening another notification bar or a popup by following these steps:

  1. Pass the ID of the popup/notification bar you would like to open to the Id field in the Triggers section (e.g. "popup").
  2. Navigate to the popup/notification bar settings, add the same ID with "#" at the beginning to the "CSS selector for manual trigger" field, and choose an option in the "Trigger open" select.

In the Popup settings, you can change layout, add image, subscribe form, edit position, change open and exit animations and options.

You can also use this popup as a button-trigger for opening another popup or notification bar by following these steps:

  1. Pass the ID of the popup/notification bar you chose to open to the Id field in the Triggers section (e.g. "notification-bar").
  2. Navigate to the popup/notification bar settings and add the same ID with "#" in the beginning to the "CSS selector for manual trigger" field.

Sections

Animated Image Collage

There are 3 types of layout:

  1. Marquee on the background
  2. Marquee on the right
  3. Carousel on the bottom

It is recommended to add a number of images that can be evenly divided by the number of columns without any remainder. The recommended minimum is 3 images per column for "Marquee on the background" and "Marquee on the right" types, and 5-6 images for the "Carousel on the bottom" type.

There are 6 types of layout:

  1. Type 1
  2. Type 2
  3. Type 3
  4. Type 4
  5. Type 5
  6. Type 6
    • 1 column
    • 2 columns
    • 3 columns
    • 4 columns
    • 5 columns
    • 6 columns

Case Studies

There are 3 types of layout:

  1. Tabs on the bottom
  2. Tabs on the left
  3. Overlay

It is recommended to add two types of icons or logos for a better experience—one for light mode and inactive tabs, and another for Dark Mode and active tabs.

Hero

There are 3 types of layout:

  1. Horizontal
  2. Vertical
  3. Overlay

Numbers

There are 3 types of layout:

  1. Columns
  2. Grid
    There are special options available for the first grid block.
  3. Slideshow

Slideshow

There are 2 types of layout:

  1. Simple
  2. Overlay

Steps

There are 4 types of layout:

  1. Columns
  2. Scroll
  3. Collapsible
  4. Slideshow

Settings

Heading Animations

There are 3 types of animations:

  1. Typewriter
  2. Rolling text
  3. Appearing text

Heading Highlightings

There are 3 types of highlightings:

  1. Simple underline
  2. Rounded underline
  3. Background

Colors

To edit the three base color schemes and add new ones, go to Theme settings > Colors. From there, you can select a color scheme in the sections and blocks where this option is available.

Dark Mode

To edit the Dark Mode settings, navigate to Theme settings > Color scheme.

Color Swatches

To enable and edit Color swatches, navigate to Theme settings > Color swatches.

The swatch trigger should match the option in Product variants.

You can also add custom colors by specifying their name and HEX color code.

Metafields

To add and edit metafields, follow these steps:

  1. Navigate to Settings > Custom data in the Admin Panel.
  2. Select an item to which you would like to add a metafield.
  3. Click the button "Add definition" and fill the fields.
  4. Navigate to the item to which you've added a metafield (e.g. Product or Collection) and add information below.

For more information about metafields, follow the link.

Custom Templates

You can easily create and customize your templates. Here's an example below:

  1. Choose the type of template you'd like to create and give it a name.
  2. In the Admin Panel, select the page you want to assign your custom template to. Choose a theme template and save the changes.
  3. Now, go back to the customizer, open the new template, and add the sections you want.

If you want to delete a custom template, go to the 'Edit code' section in the admin panel, select the template, and click the delete button. Please note that this action can impact your theme, so proceed with caution.

Page

Product Page

There are 4 types of product galleries:

  1. Slider with previews
  2. Slider with bullets
  3. Stacked gallery
  4. Grid gallery

If you would like to add more dynamic information to the product, you can use metafields. To add metafields, navigate to Settings > Custom data > Products in the Admin panel.

You can add dynamic characteristics to the product by following these steps:

  1. Add two metafield definitions with the key names "characteristics.name" and "characteristics.description".
  2. Choose the "Single-line text with list of values" type for the both metafields.
  3. Navigate to the product and add characteristics.
  4. Add Dropdown information block to the product page and enable checkbox “Assign product characteristics”.

For more information about metafields, follow the link.

Product Recommendations and Complementary Products

To add and edit product recommendations, follow these steps:

  1. Install the Search & Discovery app by Shopify from the Apps page in the Admin Panel.
  2. Once installed, open the app and follow the “Add product recommendations” link in the Feature overview section to add recommendations to your products.

You can easily edit or add recommendations for multiple products using the Bulk Editor in the Products tab in the Admin Panel.

Gift Card Recipient

To add recipient and message fields to gift card products, navigate to the customizer > Product page > But buttons block. Check the "Show recipient information form for gift card products" option that enables the display of recipient information form for gift card products.

Size Chart

To add a Size Chart, follow these steps:

  1. Create new page with a table.
  2. Add a "Advantage" block to the product page.
  3. Select "Size Chart" page. Works only in Popup toggle type.

Cart

To enable cart note, navigate to the customizer > Cart > Items, and check the “Enable cart note” option.

Free Shipping

To avoid issues in stores with multiple languages, keep the text '{amount}' untranslated.

Collection Page

To enable advanced filtering, follow these steps:

  1. Install the Search & Discovery app by Shopify from the Apps page in the Admin Panel.
  2. Once installed, open the app and follow the 'View filters' link in the Feature overview section to manage the filters.

Note: Product type and tag filters are only shown to customers shopping in the store's default language. Vendor filter values are always based on the store's default language.

Importing Our Demos

You can also copy the structure of any of our 5 demos in a few steps.

  1. Copy the demo structure from the links (Cmd-A or Ctrl-A to select all).
  2. Follow to the section Online Store > Themes in your store. Click the three dots button of your theme.
  3. Open the code editor by clicking the Edit code button.
  4. In the code editor, search for the file "index.json", select all content, and paste replacing the demo structure. Click "Save" to save your changes. If there's an error, click "Format json" and try to save the file again.

Demos Structure

  1. Electric
  2. Minimalist
  3. Radiant
  4. Active
  5. Jade

Support

You can ask any questions about the theme and our support agent will help you within 24 hours on business days.

Visit Help Center      View Terms & Conditions
High-end Shopify themes with advanced feature sets. You are Here Premium Shopify themes with broader functionality. Budget-friendly Shopify themes with all primary features for your store.