Tutorial

Creating sub-menus

With this theme you can create menus from two to three levels. In Versatile Store Style demo, the two-level menu generates a drop-down menu as well as a sidebar menu and three-level menu generates only a sidebar menu. Those menu levels comes with a breadcrumb at the top of the collection or product page.

Two-level navigation menu

To create a menu with two levels, follow these steps:

  • Assign a subcategory from one of the items of the main menu link list parent in your product tag with its corresponding collection in the Shopify Admin. For example: Action Figure is a menu item in the main menu of the store stye. This menu item contains two subcategories: Figure and Playset. From the products option in the Shopify Admin, edit or create a product and assign or enter the subcategory Figure or Playset. Then, assign the collection Action Figure.

  • Go to your website to see the final result.

Three-level navigation menu

To create a menu with three levels, follow these steps:

  • Create a new link list with the same name as the title of one of the menu items in your main menu from the navigation option in the Shopify Admin. For example, Create a link list and name it Learning which is a link item of the main menu link list. Then, add three link items: Early development, Flash cards and Magnetic letters and numbers.

  • Create a collection for each link item created on the new link list from the Collections option in the Shopify Admin. As this is a child collection, prefix it with the handle of its parent collection. For example, create a collection for Early development, Flash cards and Magnetic letters and numbers. For each collection created, prefix it with the handle of its collection parent "learning".

  • Assign a subcategory from one of the link items of the new link list created in your product tag with its collection link item. For example: Early development link item from the Learning link list contains three subcategories: Push and pull, Shapes and colors and Sorting and stacking. From the products option in the Shopify Admin, edit or create a product and assign or enter the subcategory Push and pull or Shapes and colors or Sorting and stacking. Then, assign the collection Early Development.

  • Go to your website to see the final result.

Displaying featured collection on the homepage

To display featured collections on the homepage, you need to create a link list of your collections from the Navigation option in the Shopify Admin. The link list can have any name and the link items points to a collection.

Once you created the link list, you will see it on the drop-down of "link list to use for collection" from the Theme Settings.

Moving toolbar, search and social links into the layout

To provide more control of your design, Versatile theme gives you the possibility to move the toolbar, search and social links in different parts of your layout. From the Theme Setting in your Shopify admin, you can configure the layout positions for the toolbar, social links and search.

Toolbar can be placed above or inside the header.

Social links can be placed in the header, footer or unplaced.

Search can be placed in the toolbar, header, navigation or unplaced.

Showing products on sale

To display a "SALE" banner on your product image, enter a number greater than the current price on "Compare at price" field.

From the Theme Settings in the Collection View section, you can modify the background and text color of the "SALE" banner.

Associating product images with product variants

To match your product variant with your product image, you need to enter the same title of the product variant in your product image's ALT text.