Skip to content

Off Canvas Main Menu Hide your main menu off screen.

To add a persistent off canvas main menu regardless of the screenwidth simply set/remove the following classes on the following elements:

  • 1 .navbar-toggler : remove any .d-none classes so it shows at all screenwidths. Also ensure it has the data-toggle="jpanel-menu" attribute set.
  • 2 .navbar-main : add .d-none class so the main menu is hidden all screenwidths. The menu plugin will show it as needed.
  • 3 .navbar-nav : remove any .float-*-* classes so it does not float at all.

The menu plugin copy the menu markup/HTML into a new off canvas menu which is hidden by default.


  • Menu Direction: To make the menu slide in from the left add data-direction="left" to the .navbar-toggler element.
  • Menu Target: To target a different menu other than .navbar-main set the data-target="TARGET_CLASS_OR_ID" to point at the target menu. You would need to hide the target menu manually.

Awesome Features

99.9% Uptime / Free Upgrades / Fully Responsive / Bug Free
Theme Colours

Green Red Blue Purple Pink Orange Lime Blue-dark Red-dark Brown Cyan-dark Yellow Slate Olive Teal Green-bright

Cookies are NOT enabled so colour selection is not persistent.

Back to main homepage