Sidebar Navigation Menu

Create a beautiful sidebar menu that remains hidden until clicked. The Sidebar Navigation Menu creates an off-canvas menu that appears with a customizable transition effect, allowing you to create a menu that does anything from subtly sliding into place to rotating three-dimensionally.

  • Widget Compatibility: Highly Compatible (No known issues when combining with other MuseThemes widgets)
  • Current Version: 2.2
  • Supported Devices: Desktop, Tablet, Phone

Release Log

  • 2.2: Addressed issue of gaps created when the changing of device orientation causes Muse to transition across breakpoints. The widget now forces the browser to refresh in this scenario. (03/21/2018)
  • 2.1: Fixes issue causing menu button to fail on mobile devices (02/01/2018)
  • 2.0: Complete widget rebuild to add responsive function and full compatibility with Muse 2015.2. Also adds additional customization, and doubles the number of link options (09/09/2016)
  • 1.2: Fixed javascript error when using custom buttons (03/11/2016)
  • 1.1: Fixed issue causing some users to experience crashing in Muse when opening option panel (02/12/2016)
  • 1.0: Adds collapsible panel functionality and support for responsive Muse


  • Drag the widget from the library and drop into your project in Design mode.
  • You will see 3 elements on the page. The 2 main widget components, plus a pre-styled menu button.
  • Place the 2 widget components off canvas and out of the way. If you plane to use the pre-styled menu button, place it where you like. If you're instead using the default or text button (more on this later), you can delete the pre-styled menu button.
  • You can preview the page at this point if you would like to see the sidebar menu with the default settings.
  • Select a Menu Effect. These transition styles determine how the sidebar menu appears.
  • Select a Menu Background Color.

Menu Button Setup

  • Select a button format:
    • Custom Button: You can make your own custom button. The button that is packaged with the widget is an example of a custom button. You can edit the included button or make your own. You will notice that the included button has a graphic style applied to it already. If you make your own custom button, make sure you apply a unique graphic style name to it. The graphic style name should be entered in the next field: Custom Button - Graphic Style.
    • Default Button: This option uses a default button generated by the widget. The remaining settings in this section are style settings for the default button.
    • Text Button: This option uses your own text, placed in a button. The remaining "default" styling options in this section apply to the Text button, as well as the default button.

Logo & Menu Title Options

  • You may use a menu logo if you wish. This works well for company logos.
  • Enable the menu logo if you wish to use it.
  • Load the logo file.
  • Set the width and height settings.
  • The remaining settings in this section allow you to enable and use a menu title, which will appear at the top of the menu. Set the text, font, color, etc. in this section.

Menu Item Setup

  • This section allows you to customize the menu items: text colors, fonts, size, spacing, etc.

Commonly Asked Questions

No commonly asked questions

Known Issues/Conflicts

No known issues or conflicts

Additional Info Links