Introduction
The main navigation is the header menu with three buttons: Shop, Services and Connect. Each button opens a mega-menu on desktop and a tab in the mobile menu.
None of these menus is built in a menu editor. Each one is generated from your categories or content pages, and the theme decides which pages appear, in what order and how many levels deep. To change a menu, you change the categories or content pages behind it.
For the step-by-step process of adding, removing or reordering a menu item, see Edit the menus. This section explains how each menu is put together.
The three menus at a glance
| Menu | Built from | Levels on desktop | Levels on mobile | Right-hand panel on desktop |
|---|---|---|---|---|
| Shop | Product categories | 1, 2 and 3 | 1, 2 and 3 | Content panel |
| Services | Content type services | 1 and 2 | 1, 2 and 3 | Content panel |
| Connect | Content type learn | 1 only | 1, 2 and 3 | Up to 11 brand tiles and Explore More |
Level 4 and deeper are never shown.
In all three menus, items are ordered by Sort Order, highest first. Items with the same Sort Order are listed by name, A to Z.
The theme does not enforce a set number of items at each level. Too many items will still show, but the layout may not look as designed. The Product Categories page gives guidance on sensible numbers, and Services gives today’s counts.
Shop
The Shop menu is built from the product category hierarchy, using up to 3 levels:
- Level 1: top-level categories, listed down the left of the mega-menu.
- Level 2: subcategories of a level 1 category.
- Level 3: subcategories of a level 2 category.
A level 1 category with subcategories opens a tab rather than linking straight to its page. A level 1 category with no subcategories is a plain link.
Learn more in Product Categories.
Services
The Services menu is built from content pages of the services content type, and works much like Shop:
- Level 1: main service pages, listed down the left of the mega-menu.
- Level 2: child service pages, each shown with its own Alt image 1.
- Level 3: shown on mobile only.
Unlike Shop, Services shows its pages whether or not they have anything under them.
Learn more in Services.
Connect
The Connect button was previously labelled “Learn”. The label has changed, but the content type behind it is still learn, so Connect pages are still created and edited as learn content pages in the cPanel.
Connect on desktop
- Left column: level 1
learnpages only, each as a plain link. Their child pages are never shown on desktop. - Right side: always the brand tiles, under the heading “Explore our Brands”. These are up to 11 pages of the
brandcontent type, ordered by Sort Order (highest first), followed by an Explore More tile that links to the Brands page (/brands/).
Connect has no content panel on desktop, and there is no fallback content zone for it. To change which brands appear, see Change the brand tiles in Connect.
Connect on mobile
- Shows
learnpages at levels 1, 2 and 3. A parent item opens its list, and the first entry is See All [name]. - A level 1 page with child pages can also show a content panel from its own related content, if it has any.
- The list always ends with an Our Brands link to the Brands page (content ID 153, currently
/brands/). Brand tiles are not shown on mobile.
Content panel
On desktop, each level 1 tab in Shop and Services has a panel on the right showing one linked image and title, taken from that item’s related content. If there is none, it falls back to a page set in a content zone. Connect does not use this panel on desktop.
Learn more in Content Panel.
Other site menus
The footer link columns and the home page category grid are not part of the main navigation. They come from Menu Manager menus (web_footer and category_grid). See Edit the menus for how to change them.
For developers
Theme files this page is based on
From Altapac-ReDev, branch development:
src/templates/headers/template.html: header buttons Shop, Services and Connect (#connect-button, line 97) and mobile tab Connect (#connect-mobile-tab, line 200).empty-main-content.template.htmlstill labels the mobile tab “Learn”; no content page in Altapac-Content uses that header.src/templates/headers/includes/components/desk-Menu.template.html: desktop mega-menu inside[%cache type:'cmenu' id:'web_deskmenu-v2' ttl:'86400' %]. Shopcontent_menu content_type:'category' sortby:'sortorder,name' show_empty:'0'(levels 1-3); Servicescontent_type:'services' ... show_empty:'1'(no*level_3, and*level_2does not print[@next_level@]); Connectcontent_type:'learn' ... show_empty:'1', where*level_1never prints[@next_level@].[@level2learnlist@]is never set, so the brand listcontent_type:'brand' sortby:'sortorder' show_empty:'0' limit:'11'always renders, with a hard-coded/brands/Explore More tile.src/templates/headers/includes/components/mobile-Menu.template.html: mobile menu inside[%cache type:'cmenu' id:'web_burgermenu-v2' ttl:'86400' %]. All threecontent_menucalls render levels 1-3. Connect level 1 builds a related-content panel (list type:'content' filter:'related_content=[@content_id@]' limit:'1'). “Our Brands” is[%url type:'page' id:'153' /%].
There is no learn_menu_content zone in the theme.