Widget Guidelines

Nav Menu Widget

Estimated reading: 2 minutes 599 views

A Navigation Menu is among the most important components when creating a website. It helps visitors navigate to different pages or content easily.

Follow the step-by-step instructions:

1. Go to Menu RTMKit Header & Footer.

2. And you will be able to see the Nav Menu Widget.

3. Click Add New Container.

4. Select your layout: Flexbox or Grid.

5. On the canvas, select your structure.

6. Drag the widget from Elementor.

7. Drop it on the selected area.

8. Setting Menu :

  • Click Content → Menu Setting.
  • Click Menu Select → select Header.
  • Showing the Menu by default, like the picture below.

9. If your menu doesn’t appear, click Menu Screen to add or manage your menus.

10. Setting Menu :

  • Click menu Custom Links
  • Add URL and Text → click Add to Menu.
  • Click remove to delete the menu.
  • You can move your menu: up one, down one, under, or to the top.

11. Don’t forget to click Save Menu to save your changes.

12. Setting Submenu Content :

  • Go back to the Elementor page.
  • Click Content → Submenu Content.
  • Setting sub-menu icon spacing.
  • Click Icon Library Choose Icon Click Insert.

13. Setting Hamburger :

  • Click Content → Hamburger Setting.
  • Add Hamburger Icon Open and Close: click Icon Library Choose Icon Click Insert.
  • The hamburger setting will show in a responsive mobile-like picture below.

14. Menu Wrapper Style (used to customize the menu wrapper style) :

  • Click Style → Menu Wrapper.
  • Customize the wrapper background color.

15. Menu Style (used to customize the menu style) :

  • Click Style → Menu Style.
  • Customize the typography, position, horizontal and vertical padding, space between, radius, text, and background color.

16. Submenu Style (used to customize the submenu style) :

  • Click Style → Submenu Style.
  • Customize the typography, border, horizontal and vertical padding, space between, submenu icon color and size, alignment, radius, text and background color.

17. Hamburger Style (used to customize the hamburger style) :

  • Click Style → Hamburger Style.
  • Customize the icon alignment, padding, radius, icon size, background, icon, and border color.

18. Don’t forget to click Publish to save the changes.

Share this Doc

Nav Menu Widget

Or copy link

CONTENTS