Skip to content

Documentation

Extensive Documentation for PowerPack & WooPack to help you with common questions and issues.

PowerPack

⌘K
  1. Home
  2. Docs
  3. PowerPack
  4. Modules
  5. Advanced Menu
  6. How to Setup Off Canvas Menu with Advanced Menu Module?

How to Setup Off Canvas Menu with Advanced Menu Module?

Here are the steps to set up an Off Canvas Menu with the help of the Advanced Menu module.

Step 1: Drag and drop an Advanced Menu from the panel.

PowerPack Beaver Builder menu
Advanced Menu

Step 2: In the General tab > Responsive section, change the Menu Type to Off Canvas.

Advanced Menu - off-canvas
Advanced Menu – off-canvas

Step 3: Choose the Off Canvas Direction and the Responsive Breakpoint. This will decide for which devices the off-canvas menu will work.

Step 4: Set the desired background color in the Responsive tab. You can style your menu links in the Style tab.

Advanced Menu - Off-canvas Style
Advanced Menu – Off-canvas Style

Step 5: You can also customize the close button size and color under the Responsive tab.

Advanced Menu - Close icon style
Advanced Menu – Close icon style

Demo

Click here to view the demo of the Off-Canvas Menu

×