This document will guide you through the options available in customising your store’s menu. A well thought out menu can make using your store a much more enjoyable experience for customers, and the faster they can find what they’re looking for the more time they can spend deciding on what to buy!
Note: The Admin Menu can be found in the upper-left corner of the window. Depending on the size of your screen the Menu may be open as a sidebar, or it may be hidden to save screen space. If the Menu is closed just click on the three bars icon to open it. Any directions to use the menu will be written in this format: Menu > Menu Section > Menu Item (for example Menu > Customise > Theme Editor).
To get to the Menu Builder go to Menu > Customise > Menu Builder.
The page is split into two parts - Main is the top navigation on your store, and Footer controls the links that appear in the Footer on every page of your store.
There is a help video that quickly shows what you can do in the Menu Builder - click on the See how it works link to watch it.
When you first create your store the following menu items will be created by default:
- All Products
- About Us
- Contact Us
Let’s take a look at the menu structure. The order of your menu items from top to bottom on this page controls how your menu will display left to right in your storefront. You can reorder your menu - this is covered in more detail below.
You should be able to see that All Products is nested inside the Shop entry. This means that the All Products link will appear as part of a dropdown menu underneath Shop on the storefront.
NOTE: The default Kong Theme allows one level of nested menu items. Any menu items that are nested 2 levels deep or below will not show in the storefront menu.
The three icons to the right of each menu item do the following:
- Pencil - edit this menu item
- Eye - make this menu item visible / invisible (black is visible, light grey is invisible)
- Bin/Trashcan - Delete this menu item
NOTE: If you have created any Collections they will have been added to your menu under Shop. If you’ve renamed the Shop menu item they will appear under whatever it’s new name is. We’ll discuss Collections in more detail below.
To reorder items in your menu you can click and drag the grey handle with a cross icon at the right edge of a menu item.
Adding Menu Items
Click Add another Menu item below the Main Menu. This will open an empty Menu Item Title text box for you to name the Menu Item and below that will be a boxout titled This menu item links to… This is where you select the Menu Item’s target. The first dropdown chooses the area/type of link, and the second is the specific item that’s being linked to. From the first dropdown you can select from:
- Custom Store Page
- Built-in Store Page
- External Link
- No Link
For all of these except External Link and No Link you will get a list of valid pages to select from in the right hand dropdown. Any External Links you add must start with either http:// or https://.
Once you’ve selected your new Menu Item you must click the greyed out Eye Icon to activate it, otherwise it will not appear on your storefront.
Click Update My Store Menus at the bottom of the page to save your changes. They will available on your storefront immediately.
Auto-Add Collections and Custom Pages
It is important to note that any Collections you’ve created will be automatically added to your store’s menu under the Shop menu item. If the Shop item has been renamed they will appear under whatever the newly named item is.
If you create a new Collection with the status Hidden it will be added to your menu under Shop, but its visibility will be turned off by default. If you create a Collection and set its visibility to Available on a Specific Date it will be added to the menu under Shop with visibility turned off.
If you add a new Custom Store Page (Menu > Customise > Store Pages) it will be added to the end of your Menu, but the status will initially be set to invisible. You make it visible, reorder it in the menu, or delete it.
Renaming Items outside of the Menu Builder
IMPORTANT: If you edit the title of a Collection, Product or Custom Store Page (through Menu > Manage > Collections > Collection Name) the Menu Item Title associated with it does NOT automatically update. You will need to manually retype the Menu Item’s Title. You can do this by simply clicking in the name field and editing as appropriate. If you need to see exactly which Collection is being linked to (for example, if you have a number of similarly-named Collections) you can click the Edit icon (the small pencil image) to see where it goes. A box will appear below the menu item which says This menu item links to... and you will be able to see and edit the target link.
In the Footer you can drag and drop menu items to reorder them as in the Main menu. One notable difference is that the footer in the default theme does not have dropdown menus, so you cannot nest items inside each other. This may vary with other themes, so make sure you check any documentation that accompanies alternative themes.
We are constantly working to improve Kong and we update this documentation to keep it in line with the latest improvements. If there’s anything in this document that you think is out of date or could be improved please get in touch and we’ll be happy to talk to you about it.