Tutorial

Creating sub-menus

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

To create a menu with two levels, follow this step:
  • Assign a subcategory from one of the items of the link list which its name is contained in the main menu link list parent in your product tag with its corresponding link item collection. For example: Catalog is a link in the main menu link list parent and its link list has two items: Places and Sea Life. Places contains three subcategories: Mountains, Parks and Structure. From the products option in the Shopify Admin, edit or create a product and assign or enter the subcategory Mountains, Parks and Structure. Then, assign the collection Places.

  • Go to your website to see the final result.

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

  • Create a new link list with the same name as one of the link items of the link list which its name is contained in the main menu link list from the navigation option in the Shopify Admin. For example, Create a link list and name it Sea Life. Sea Life is a link item of Shop link list which is the link item of the main menu link list. Then, add two link items: Aquatic Plants and Sea Animals.

  • 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 Aquatic Plants and Sea Animals. For each collection created, prefix it with the handle of its collection parent "sea-life".

  • Assign a subcategory from one of the link items of the new link list created in your product tag with its link item collection. For example: Sea Animals link item from the Sea Life link list contains three subcategories: Crustaceans, Fishes and Water-dwelling. From the products option in the Shopify Admin, edit or create a product and assign or enter the subcategory Crustaceans, Fishes and Water-dwelling. Then, assign the collection Sea Animals.

  • 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. To see the illustration, visit Versatile Store Style tutorial of this section.