Sub-categories - Revision history

Shawn at 02:17, 13 October 2021

2021-10-13T02:17:20Z

Shawn at 02:16, 13 October 2021

2021-10-13T02:16:01Z

Shawn at 00:06, 13 September 2021

2021-09-13T00:06:29Z

Shawn at 00:03, 13 September 2021

2021-09-13T00:03:58Z

Shawn: /* Creating drop-down menus */

2021-09-12T22:25:07Z

Creating drop-down menus

Shawn at 22:24, 12 September 2021

2021-09-12T22:24:37Z

Shawn at 22:24, 12 September 2021

2021-09-12T22:24:13Z

Shawn: Created page with "Rather than categories, and sub-categories, Spiffy Stores uses Collections. A collection is where you bring together all similar products and present them together so tha..."

2021-09-12T22:22:29Z

Created page with "Rather than categories, and sub-categories, Spiffy Stores uses Collections. A collection is where you bring together all similar products and present them together so tha..."

New page

Rather than categories, and sub-categories, Spiffy Stores uses [[Collections]]. A collection is where you bring together all similar products and present them together so that your customers can easily browse and find exactly the right products for them to buy. A product can be in a number of collections.

If you want to create a hierarchy of categories, and subcategories, you can do this simple by using menus.

=== Creating drop-down menus ===
<html>
<iframe src="https://player.vimeo.com/video/523999241?badge=0&autopause=0&player_id=0&app_id=58479" width="1250" height="703" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen title="simple-theme-mega-menus"></iframe>
</html>
 The Simple theme supports up to 4 levels of drop-down menus. This should be plenty. If you have more complex menu requirements, then you'll likely want to create a mega menu. Instructions for creating a mega menu can be found below.

There's no mucking about with code to get your drop-down menus working. You can create them simply by following the simple steps below. One important note though... you can't create links to nothing! If you haven't created the page or collection you want to link to, you need to create them first. 
<gallery heights="200px" widths="200px" class="right">
Image:Vintage-theme-menu-tutorial-01.png|Creating a drop-down menu
</gallery>
'''First item'''
#Log in to your store's Toolbox and go to the "Store menus" tab
#Scroll down to the "Top Menu" section, and click "Add new Menu Item"
#Type in the name of your menu item
#Select whether you want your menu item to link to a page, product, or collection
#A new list of options will appear. Select the name of your page that you want to link to.
#Click the "Add menu item" button to save.

 

'''Sub item'''
#Create another menu item the same way you created one above
#Click the "Reorder" link
#Click and drag the item you want to drop down to the right (so it sits directly underneath and to the right of the one above - see example)
#Click "Done reordering" 
Previewing your store should show your second item as a drop-down. You can do this with multiple levels, and re-arrange your menus by dragging items up, down, left, or right whilst you're in "re-order" mode.

@@ Line 4: / Line 4: @@
 #If you haven't already created the main collection page in your store, create it first.  Check its handle to make sure that it matches the name of your page (e.g.  if your page is called "Blue Widgets", its handle should be "blue-widgets").<br>
 #Go to the "Store menus" tab in your store's Toolbox<br>
 #Click the "Add a new menu" button in the top right of your screen, and create a menu with THE SAME NAME as the page you want it to display on.<br>

@@ Line 1: / Line 1: @@
 Rather than categories, and sub-categories, Spiffy Stores uses [[Collections]].  A collection is where you bring together all similar products and present them together so that your customers can easily browse and find exactly the right products for them to buy.  A product can be in a number of collections.
 If you want to create a hierarchy of categories, and subcategories, you can do this simply by using menus.
-=== Creating drop-down menus ===
+#If you haven't already created the main collection page in your store, create it first.  Check its handle to make sure that it matches the name of your page (e.g.  if your page is called "Blue Widgets", its handle should be "blue-widgets").<br>
 <html>
 <iframe src="https://player.vimeo.com/video/523999241?badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479" width="1250" height="703" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen title="simple-theme-mega-menus"></iframe>

@@ Line 23: / Line 23: @@
 <br>
-'''Sub item'''
+'''Second level item'''
 #Create another menu item the same way you created one above
 #Click the "Reorder" link
@@ Line 29: / Line 29: @@
 #Click "Done reordering"<br><br>
 Previewing your store should show your second item as a drop-down.  You can do this with multiple levels, and re-arrange your menus by dragging items up, down, left, or right whilst you're in "re-order" mode.<br><br>
 <br>

@@ Line 7: / Line 7: @@
 <iframe src="https://player.vimeo.com/video/523999241?badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479" width="1250" height="703" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen title="simple-theme-mega-menus"></iframe>
 </html>
-<br><br>Most of our themes support up to 4 levels of drop-down menus. This should be plenty.  If you have more complex menu requirements, then you'll likely want to create a mega menu.  The [[The Simple Theme Guide|Simple]] and [[The Adelaide Theme Guide|Adelaide]] themes support mega menus.
+<br><br>Most of our themes support up to 4 levels of drop-down menus. This should be plenty.  If you have more complex menu requirements, then you'll likely want to create a mega menu.  The [[The Simple Theme Guide|Simple]] and [[The Adelaide ecommerce theme guide|Adelaide]] themes support mega menus.
 There's no mucking about with code to get your drop-down menus working. You can create them simply by following the simple steps below. One important note though... <span style="color: #ff6b00;">you can't create links to nothing!</span>  If you haven't created the page or collection you want to link to, you need to create them first.<br><br>

@@ Line 7: / Line 7: @@
 <iframe src="https://player.vimeo.com/video/523999241?badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479" width="1250" height="703" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen title="simple-theme-mega-menus"></iframe>
 </html>
-<br><br>Most of our themes support up to 4 levels of drop-down menus. This should be plenty.  If you have more complex menu requirements, then you'll likely want to create a mega menu.  The [[Simple| The Simple Theme Guide]] and [[Adelaide| The Adelaide Theme Guide]] themes support mega menus.
+<br><br>Most of our themes support up to 4 levels of drop-down menus. This should be plenty.  If you have more complex menu requirements, then you'll likely want to create a mega menu.  The [[The Simple Theme Guide|Simple]] and [[The Adelaide Theme Guide|Adelaide]] themes support mega menus.
 There's no mucking about with code to get your drop-down menus working. You can create them simply by following the simple steps below. One important note though... <span style="color: #ff6b00;">you can't create links to nothing!</span>  If you haven't created the page or collection you want to link to, you need to create them first.<br><br>