ProductCart generates a list-based (<ul><li>…) file containing your category navigation links. A static file is generated to store your navigation links. This improves storefront performance (less database queries). Remember to rerun this feature when you add/edit categories (and products if included in the navigation): in many cases the ProductCart Control Panel will automatically remind you to do so.
Create or update your storefront category navigationTo navigate to the following page, select Settings > Images & Navigation > Generate Category Navigation.
When creating your navigation file you have four options that define the type and number of links:
Choosing what to include
- Include categories and sub-categories, but no products
- Include categories, sub-categories, and their products
- Include only top-level categories and their products
- Include only top-level categories
A “More products…” link is automatically added if there more products in the category than the number specified here.
Absolute vs. Relative URLsYou can choose whether to create a navigation tree that uses relative vs. absolute links. Relative links simply point to the files in the same folder (the pc folder in your storefront). Absolute links use the full URL to the page (e.g. http://www.mystore.com/shop/pc/...).
Some search engine optimization experts say that your link structure should be consistent across your Web site. So if you are using absolute links elsewhere on your Web site, you should use absolute links in the store navigation as well.
If you are in doubt, use absolute links, but make sure that the URL that is generated by ProductCart is correct. If not, this might indicate that the file "includes/storeconstants.asp" does not include a correct "Store URL". Find out how to change your store URL.
Category Navigation Menu OptionsIn ProductCart v5.0 and above, you can only generate navigation using unordered lists. This is a departure from the use of table rows and cells in v4.7 and before. Since v5.x now uses HTML5 and CSS3 instead of HTML tables for store layout, the category navigation has been updated to remove deprecated use of tables for navigation.
Currently, there are 3 options that are provided for generating category navigation:
- jQuery Horizontal Menu Bar
- jQuery Vertical Menu Bar
Here is an example of a navigation menu that uses the jQuery Vertical Menu Bar. This particular example is shown with the "Basic Blue" theme that is the default in ProductCart v5.x.
Here is an example of the HTML that ProductCart generates for the unordered list:
<ul id="myStoreNav"> <li><a href="viewCategories.asp?idCategory=227">Accessories</a> <ul> <li><a href="viewCategories.asp?idCategory=238">Gloves</a></li> ...
If you'd still like to read more, see the more advanced article "How to Add Category Navigation Using Built-in Tools" within the "How To" section of this support base.