How to Apply the Mobile Navigation Template?
A mobile navigation template created with TheGem Templates Builder can be applied to your website's navigation in two ways:
- Via the built-in header (using Theme Options)
- Via the header template (using Templates Builder)
Built-In Header (Theme Options)
If your website uses the built-in header, you can apply the mobile navigation template to the mobile navigation through Theme Options:
- Go to Theme Options → Menu & Header
- In the "Menu & Header Layout" section, switch to mobile settings
- Select "Global Section"
- In the "Select Template (Global Section)" dropdown, select the mobile navigation template you created using the Templates Builder.
You can also click the "Create New Template" button if you'd like to create a new mobile navigation template.
If you wish to use one of the pre-built mobile navigation templates, click the "Import Pre-Built Template" button. This opens a popup with an overview of available pre-built templates to choose from.
Header Template (Templates Builder)
If your website uses a header template created with Templates Builder, you can apply the mobile navigation template by editing the "Menu" content element while editing your header template in the page builder.
- Edit your header template (see this article "How to Edit the Header Template?" )
- Select the "Menu" content widget
- Under the "Mobile Menu Layout" section, in the "Layout Mobile" field, select "Global Section"
- In the "Select Global Section" dropdown, choose the global section template you want to use for your mobile navigation
Elementor Screenshot:
WPBakery Screenshot:
You can also click the "Create Template" button if you want to create a new mobile navigation template.
If you wish to use one of the pre-built mobile navigation templates, click the "Prebuilt Templates" button. This opens a popup with an overview of available pre-built templates to choose from.