Hamburger Menu

What is Hamburger Menu?

It is a side menu which toggles from left or right side. It is often called as a Drawer Menu.

Follow Below steps to integrate Hamburger Menu.

1.) Add Hamburger Menu to the Right or Left side of Navigation Bar

  • Go to screen section and go to Navigation Bar Buttons from Navigation bar section.

  • Add a button in "Left Side Buttons" or "Right Side Buttons" and select "Hamburger" from the popup.

2.) Choose the style of your choice

  • We have 4 styles by default.

  • Style 1 has left aligned menu items which is fully customizable in font size and color.

  • Style 2 has left aligned menu items with icons and logo, with heading on top and close button in bottom. It is fully customizable.

  • Style 3 has left aligned menu items with icons and a different animation to open and close which is fully customizable.

  • Style 4 has center aligned menu items which is fully customizable in font size and color.

  • Click "Next" after choosing your preferable style.

3.) Add Menu items

  • Next is to start adding main items links in your hamburger menu.

  • Click on "Add menu item" and add menu. You can add nested menu items(up to 1 level).

  • You can see the changes in previewer. You can chose Android or iOS.

  • Click "Next" once you are done adding it.

4.) Customize

  • Here, we will customize the look.

  • Background color is the color of the side menu.

  • Icon is the button icon you want to show to open the hamburger menu.

  • Close Button Icon is the icon for "closing the hamburger menu.

  • Menu Text Size is the size of menu fonts.

  • Menu Text Weight is the weight of the menu font. You choose "Bold", "Semi bold", "Regular"

  • Menu Text color is the font color of Menu items.

  • Menu Icon Size is the size of the icons you have given on left size of menu items.

5.) Click on Add

6.) Don't Forget to click on Save as a Draft!

Last updated