Responsive Menu (using 2 kinds of menu)

Wanting to create a much fancy menu but classic menu is limiting? Here we will show how to use 2 kind of menu and some simple steps of hide and show to create a responsive menu layout for you website

row1_7.jpg

Step 01
Drag & drop a classic menu (Horizontal Menu) and a burger menu into the page. Menu is located top left of the editor menu section title Object.
row1_1.jpg
Step 02
Select the burger menu, go to Properties > Arrangement > Display and set to "none". This will hide the burger menu.
row1_2.jpg
row1_4.jpg
Step 03
Now change to tablet or mobile view by click on the the top right icon. As the burger menu is hidden you can call the setting window by double clicking the breadcrumb at the bottom (Click on the correct object to call the correct setting window). Then go to Properties > Arrangement > Display and set to "block". The burger menu will reappear.
row1_5.jpg
hidden_layer.jpg
row1_3.jpg
Step 04
Now to hide the classic menu, first select it and go to Properties > Arrangement > Display and set to "none" to hide the menu.
menu_5.jpg
row1_4.jpg

Can't find what you're looking for? Let us help you!

Contact Us