Expanding Nav Button

https://www.muse-themes.com/products/expanding-nav-button

This simple navigation widget offers a clean and compact presentation of your site navigation menu. The menu button uses an animated transition to expand into a larger menu (horizontal or vertical), complete with custom icons and page labels.

While the Expanding Nav Button widget is perfect for site navigation, consider using it for product menus, option selectors, tooltips, mobile-specific nav and more!

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

Release Log

  • 1.0: Initial release




Setup in Muse

Note that this widget is best used on small to medium sized websites. Those with larger websites should consider more powerful navigation like our Nav System Pro widget. This widget offers a maximum of 10 linked items in the menu.

  • Place the widget on your site.
  • This widget is best placed off canvas, to keep it out of the way. The menu button position will be pinned on the published site, so placing the widget off canvas is ideal.
  • Note: The height you place the widget (on the Y-axis) in the off-canvas area is important. The height of the widget determines the height of the menu button when published.

  • Open the widget option panel.
  • Expand Direction: The menu can expand vertically or horizontally.
  • Button Position (Vertical and Horizontal Expansion): Depending on the setting chosen in the Expand Direction setting, you have placement options. The vertical expansion option allows for placement top left/center/right, and the horizontal expansion option allows for placement top center or bottom center.

NAVIGATION STYLING SECTION

There are several styling options that apply to the menu button, as well as the expanded menu. The settings within this section are self explanatory and are labeled with their specific purpose; so they will not be explained here in detail.

ITEMS SETUP SECTIONS

Each Item (1-10) has a specific set of options. Note that each Item's options (1-10) are identical.

  • Enable Item: Each item you wish to show should be enabled.
  • Icon SVG: Each menu item allows an SVG icon to be used. It is suggested that you use an icon for each menu item.
  • Item Label: This is the text that shows up next to each menu icon (this text appears on hover when horizontal expansion is selected)
  • Item Link: This field requires the actual link to the desired page. This means that you must know the specific URL of the page you are linking to. If your site is not yet published, you will need to estimate the URL or return to the menu to fill this in once you've confirmed the URL.
  • Item Target Link: This option allows for links to be opened in a new page or same page. If you're using this widget in its typical usage as site navigation, it's best to leave this setting in its default state of "Same Window".
  • Continue to set up all items as needed.

Commonly Asked Questions

No commonly asked questions


Known Issues/Conflicts

No known issues or conflicts


Additional Info Links