Header with burger menu not showing on mobile

Hi there magicians!

I have used an existing Header from Design Cloud (for mobile only) but have replaced the Burger Menu and Social Icons with my own. It is showing nicely on the Cornerstone mobile preview and working, however when actually live on the mobile it doesn’t show this header at all.

It is as if, the header is being hidden or has no permission, I have used the ‘‘hiding during break points’’ function to differentiate between my Mobile & Desktop. Mobile will have native header builder (current one) & Desktop has Revolution Slider as header.

In need of magic…

Hello @Moomed,

Thanks for writing in! In your custom header, you have Header & Logo and the Hero Area bar. Which one is the bar for mobile?

Please make sure that you properly set the z-indexes of each bar.

Kindly let us know how it goes.

Hi @ruenel, thanks for looking into it. Both bars are being used for Mobile (Desktop excluded, Revolution Slider used for that) these were pre-set taken from the Business Success Header that’s how they were set.

I haven’t looked into Z-Index, are they set correctly ? Are the Burger Menu and Social Icons showing on live Mobile ?

Update: I’ve looked into it, you have made a test header and added ‘‘ID: bstb’’ however nothing changed. As you see below, the socials & burger will show in the preview, however when actually live on mobile browser they don’t show up at all.

Hi @Moomed,

I have checked your website and found that the problem with the z-index value of the bar containing the Hamburger menu and the Social Icons. I would suggest you increase the z-index value for the bar greater than the default one i.e. 9999.

Hope it helps.
Thanks

Hi @tristup

Have played with the Z-Index but unfortunately nothing helped, I don’t understand why.

I’m forced to start from scratch and surely NOT use a pre-existing header from the Design Cloud as I have spent too much time on this issue. Thanks in any case, cheers!

Hi @Moomed,

I have checked your site and found that the Hamburger menu and Social Icons are visible. If you are not getting that, I would suggest you check once by clearing all types of cache including Style Cache from Cornerstone > Settings > System > Clear Style Cache.

Thanks

Yes, because I’ve solved it, by editing the CSS in the bar which was there from the pre-set header, found out this was blocking it.

Hello @Moomed,

Glad that you were able to fix the issue and things are well for you. Please feel free to open a new thread if you have any more concerns.

Thanks

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