Mobile hamburger menu button does not function

Support
#1

Hi, the button appears on the mobile site but it does not function when clicked.

53bythsea.com

#2

Hello @juryk,

Thanks for writing in! I can see that you are using the latest Cornerstone version. You are still using an old X theme which is no longer compatible with the Cornerstone. X 7.1.2 is now available in automatic updates! This release contains fixes for several issues, like you have mentioned above, so be sure to check out the changelog (https://theme.co/changelog/). Please do update to the latest version. After doing the updates, always remember to clear all caches when updating so that the code from the latest release is always in use. This will help you to avoid any potential errors.

After doing the updates, always remember to clear all caches (if you are using WP Rocket, WP SuperCache or W3 Total Cache) when updating so that the code from the latest release is always in use. This will help you to avoid any potential errors.

And please clear your browser cache too. You may use private browsing mode in testing your site to make sure that you are viewing the latest codes from the updates and not the cached version in your browser.

Cheers.

#3

Thank you for the quick reply. I have updated to the latest X version, the hamburger button is completely gone now

#4

Hello @juryk,

Your mobile menu icon is not gone. It is just invisible. To resolve this issue, please add the following CSS code in the X > Theme Options > Global CSS (http://prntscr.com/evui3r)

.x-btn-navbar, .x-btn-navbar.collapsed,
.x-btn-navbar.collapsed:hover {
    font-size: 10px;
    color: #000;
}

.x-btn-navbar:hover {
    color: #e5e5e5;
}

We would love to know if this has worked for you. Thank you.

#5

Thank you, but this did not fix the problem I still dont see it.

Additionally, it appears that a connection over https break my navigation in mobile, while a http connection looks fine, could you advise on this as well?

#6

Hello @juryk,

The code is working. I have tested it first before giving it to you.

The problem is, you have a mobile phone browser cache issue. You will need to clear your mobile phone browse cache first or use private browsing mode and test your site again.

The given css do not depend on http or https to take effect. You are not having https setting as well. It is evident when you go to Settings > General > Site URL.

Hope this explains it briefly.

#7

Hello, thank you for helping me so quickly,

I have confirmed on two separate mobile devices, an ipad as well as an iphone that the hamburger does not appear. I have cleared cache in both and also tried private mode.

I can see the functionality within cornerstone when adjusting the resolution preview. It works fine, also in firefox and chrome when inspecting in developer mode and changing resolution there i see the menu button fine. But in actual mobile devices it is not displayed.

#8

After updating the site url settings it seems to be working fine under https…however under http the button is invisible but clicking at the position will open it…very odd behavior

#9

Hello @juryk,

I have tested your site on my phone.

The mobile menu is displaying. And yes, please use https because in most cases, modern browsers will automatically use https and if your WP setting is just http, it will create a CORS or Cross Origin Resource Sharing issue which could be the case.

Regards.

#10

thank you for all your help RueNel!

#11

You are most welcome!

#12

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