Menu Button Visibility Breakpoint

What am I missing here? The hamburger menu button shows up no matter what breakpoint setting I set regarding “Menu icon for”. I want to display the main menu on the tablet breakpoint and HIDE the hamburger menu button because there are only 3 links. I want to enable the menu button on the landscape phone breakpoint and down only.

Thank you.


Here is my site Read-Only: Webflow - World Innovation Network

Hi,

try clicking on your tablet view then selecting the mobile menu button in your nav bar and setting the the ‘Display’ to ‘None’. (in the ‘Style’ settings menu under ‘Layout’).

You will then probably have to go into mobile landscape view and set it back to ‘Flex’ as it may have cascaded down to both mobile landscape and mobile portrait.

I tried unhiding the menu with link blocks and hiding the mobile button manually at this breakpoint but I get the same result. Question for community. Can you get the “Show Menu Icon For…” to work?

Please include your site’s Read-Only Share Link with your question.
A read-only link allows the community to view your project without making any edits to it and help diagnose your issue or provide feedback.

If your project has custom code or layout issues on the published site, please share that URI as well.

Right. which is weird for confidential content. But ok, I edited my first post including link. Does this feature work for anyone else when you select a lower breakpoint for menu button?

Hi,

For the mobile menu just set ‘Menu Icon for:’ setting to tablet and your menu button will display.
Screenshot 2020-05-22 at 08.07.58

Slightly strange config for your Navbar as it’s wrapped in your section element – seems to work though.

Hope this works for you…

Thank you. Done. I want to make it clear that I want to HIDE the hamburger menu on tablet breakpoint and keep the regular menu because we only have 3 pages (links). They fit fine in tablet. I’ve tried manually hiding and unhiding elements but the result is the same.

Thanks Ace, but I want the opposite. I want to HIDE it on a tablet. I only have 3 links so no need for the dreadful hamburger menu for 3 menu items. That’s why I wanted it to appear on the landscape mobile breakpoint and down. But it’s not working; the hamburger menu still appears. See my screen capture above. My client wants to launch today and I have been stuck on this for 2 days. If, I am not mistaken there is trouble ticket support. I’ll try that.

Hi,

The visibility of the burger menu is controlled in the navbar settings (when your navbar element is selected). If you only want your burger menu to display on phone click the phone icon. It will automatically display your desktop menu links on the other breakpoints.

1 Like

Thanks! When I started a new project and did what Ace says it works. Ace’s solution is it. You must select the Navbar element (parent block) to effect the button (child element) visibility setting.
BEM