Nav Collapsed doesn't show hamburger

Support
#1

Hello -
I have a brand-new site running current versions of Pro and Cornerstone. One Header Bar is active for bigger screens and contains a Navigation Inline element. It’s working fine. A second Header Bar is active for mobile with a Navigation Collapsible element. The problem is, I was expecting the mobile menu to start out as a hamburger, and not a list. I don’t like the way it looks with a long list-style menu taking up so much real estate on mobile as soon as the page loads. I can’t even find any styling options for the Collapsible Nav that make me think it would have a hamburger. Originally I had a Dropdown Nav, but since I have submenus, they were displaying partially off-screen on small mobile devices. I read a Forum post that said I should be using a Collapsible element, and this post had a screencast that showed the hamburger element.

Can you please advise? The site is https://staging.papersoft.com and I have already tried clearing cache, disabling plugins, etc… numerous times.
Thanks!
Cindy

#2

Hello Cindy,

Thanks for writing in!

Please be advised that the Navigation Inline element that you have added in your custom header is best to use for larger screens. You also need to add Navigation Collapsed, Navigation Layered, or Navigation Off-canvas which will serve as your mobile menu. You can show or hide the navigation elements by utilizing the “Hide During Breakpoints” option in the navigation element settings. Perhaps this documentation can help you:

or check out this video tutorial in creating the custom header:

Best Regards.

#3

Sure, as I mentioned above, my Nav Inline was in one bar intended for larger screens, and my Nav Collapsed was in a separate bar intended for mobile. I had hidden/shown the bars based on screen size already. The issue comes with the Nav Collapsed not showing a hamburger menu at all, just a list of top-level menu items.

This behavior is not consistent with videos I have seen about the Nav Collapsed element.

I have edited the header in an attempt to fix it, so now both Nav elements are in the same container, and the Nav elements are hidden/shown based on screen size. This did not help - I still get no hamburger menu on mobile, Just a list of top-level elements.

Does the Nav Collapsed element even have a hamburger any more?

#4

Hello @HoodSiegal,

Thanks for the clarifications. Now, I am seeing what you mean. Yes, the Nav Collpased does not have a toggle menu. You can insert the Nav Collapsed inside a Dropdown element so that you will have a toggle menu. We would be happy to give you an example if we can access your site. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
- Confirmation that we can access and make changes to your site
​

To know how to create a secure note, please check this out: How The Forum Works

image
image1040×250 17.4 KB

Best Regards.

#5

Thank you - I was able to get this working by adding the Dropdown element.

#6

You are most welcome @HoodSiegal

#7

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