How to add a toggle open menu for desktop

One of the features of Kadence Pro is the Toggle Widget Area header builder item using which a hamburger menu icon can be set to slide open an Off Canvas widget area.

Any number of widgets including a Navigation Menu can be added inside this widget area. Here is a quick demo of Toggle Widget Area in action:

Note: This feature is currently available for Desktops and not Tablets/Mobiles.

To get started make sure you have entered your license details at Appearance > Kadence first and then enableĀ Header Addons.

Header Addons in Kadence Pro

Click on Customize link under Header Addons or visit the WordPress Customizer via the admin menu link under Appearance or via the WP toolbar link if on the front end.

Go to the Header section.

Drag Toggle Widget Area item into your desired location.

Dragging Toggle Widget Area into the Header Builder

To configure the Toggle Widget Area, click on the pencil icon in the header or the gear icon in the header builder.

Configuring Toggle Widget Area

Trigger Menu text which is typically “Menu” will appear to the left of the hamburger menu icon.

To add widgets inside the Off Canvas Widget Area click on Add Widget Items.

Toggle Widget Area general settings

Widgets can be added by clicking on + Add a Widget button.

Header Off Canvas configuration

You are most likely going to be adding a Navigation Menu.

Adding widgets in Header Off Canvas

Below are the available Design settings: