Mobile Header Help

Hello,

On mobile, I have 2 submenus and I can’t figure out how to remove the one that isn’t “nagivation collasped.” Then I need to move the navigation collapsed element all the way to the right. Please assist.

Thank you!

Hi Mary,

Thank you for writing in, that other mobile button you have is a Navigation Dropdown it was added on your 2nd bar, 2nd container. Please remove that and replace that with your Navigation Collapsed button.

View your header builder in mobile view so you can see it in action.



Hope it helps,
Cheers!

Thank you, I got that portion figured out, but one last thing, the mobile menu botton is solid white, how can I add some sort of accent color, such as making those 3 horizontal lines be black?

Hi Mary,

Please inspect your Navigation Collapsed element, then under its Toggle > Text tab, you’ll see the color option. The interaction is the color of the toggle when you tap the menu or hover on desktop.



I saw a couple of issue on your header that I want to tackle in advance. 1) there is another Navigation Collapsed element in your header, it is not visible because its pure white with no shadow effect like the visible. it is not visible but its clickable, so you might want to remove that.



  1. Your first bar which is positioned absolute and empty has a higher z-index than the bar 2 which has the Navigation Collapsed, this puts your bar 2 behind the bar 1, resulting on the Navigation Collapsed and Navigation Inline not being clickable.

Please inspect your empty bar 1 and adjust its z-index, make it equal or lower than the z-index of bar 2. Or just delete the empty bar 1 if its not necessary.



Hope it helps,
Cheers!

Hello,

I’m having a little trouble determining which element is the one I don’t need. Can you assist me with removing the navigation collapsed mobile element that I don’t need? Also, about 1/2 of my menu is now not displaying. Please assist. Thank you!

Hi,

I went ahead and remove the unnecessary elements and make your menu visible.

Kindly check in your end.

To find the elements, you go to Layout and hover over the elements. It will then be highlighted in your header.

Thanks

Hello, the mobile button portion looks solved, but half my menu is still cut off, both on mobile and on desktop. Please assist.

Hi There,

Would you mind providing us with your screenshots and also telling us which devices you’re using?

I couldn’t replicate this issue on my iPhone 7.

Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.