The menu shortcode is the most important shortcode in our themes, since it renders your website’s navigation menu and adds all your website’s pages automatically.
The shortcode has a couple of behaviours:
- Once you publish a new page on your website, this shortcode detects the new page and adds it to the navigation.
- It automatically switches to responsive mode (hamburger menu) in smaller screens (Tablets, smartphones).
- The shortcode arranges the page order according to the order you set to your pages in the Pages section.
- If you create a menu under ‘Appearance -> Menus’ in the WordPress backend, the shortcode will display the page order from ‘Appearance-> Menus’ instead.
- The shortcode also accepts a class attribute for styling purposes.
Usage:
[​menu name="" class=""]
Output:
▶ Desktop
▶ Mobile
Multiple menus
If you create multiple menus under ‘Appearance -> Menus’, you can use the menu shortcode multiple times in different parts of your website, however you must define the menu name within the shortcode with the name=”” attribute. This allows you to specify which menu you want to use.
Example: if your menu name is ‘Custom Navigation’, the shortcode would be
[​menu name="Custom Navigation"]