Header stuck and screen stuck

Hello,

The header on our website is still getting stuck. I posted about this in the past and you said it wasn’t happening on your screen. However, it is still happening, so we would love to find ways to fix it.

Your can see in this video the header gets stuck on the hero image. Additionally, sometimes the whole page gets stuck and even when scrolling, you can’t move on the page.

Hello Ashley,

Thanks for writing in! I have investigated the issue and I was able to replicate it. It only happens in the Safari browser. Using Chrome or Firefox seems perfect. This could be a Safari Browsing caching issue. I also found out that you are using Cloudflare. Please purge your site cache and then turn ON the Development Mode before testing the site in Safari’s private browsing mode again.

Kindly let us know how it goes.

I cleared the cache as shown below. How do I turn on development mode?

Hi Ashely,

You need to turn on the Development Mode in the Cloudfare dashboard, and then clear all types of cache including the Style Cache from Cornerstone > Settings > System > Clear Style Cache and then check in the incognito/private mode of the browser.

Hope it helps.
Thanks

Hi, where is the cloud fare dashboard? Forgive me, I did not know we used cloud fare and I do not know what that is.

I pressed clear style cache in the place you displayed above. Thank you for that.

Will this prevent only my screen from the header getting stuck… I want to make sure this doesn’t happen to other users on our site.

Hi Ashely,

You need to login into your Cloudfare account in https://www.cloudflare.com and enable the Development Mode for the specific website.

Hope it helps.
Thanks

Thank you. I need to find out who has the login for this and then I will try that.

Just to confirm… how can I prevent this from happening on everyone’s screen? Will doing this only help the display on my screen?

Hello Ashley,

Based on my test, it is only happening when using a Safari browser. If most users will be using Chrome, Firefox, or MS Edge. Clearing the Cloudflare site cache could help.

Cheers.

Okay, thank you. Unfortunately we don’t know whose email is associated with our account so I am asking around the previous people who worked on this site to try and figure it out.

If there is anything else we can do to solve this problem, please let me know. It would be a big issue if this continued. I imagine many people would leave our site if the problem persists.

Thank you again for your help.

Hi Ashley,

If you don’t know the account holder for the Cloudflare, you can update the nameservers in your domain provider. In that way, the Cloudflare is disconnected in your website.

Hope that helps.

I found out who has access to Cloudflare and they cleared the cache. The problem of getting stuck is still persisting. What else can we do to solve this problem? We are very concerned this is affecting our customer experience. Thank you very much for your help.

Hey Ahsley,

Would you able to give us access to your website and same goes for Cloudflare? To do that, please give us the following information in a Secure Note.

  • WordPress Login URL
  • Admin level username and password
  • Cloudflare account ( Username and Password )

You can find the Secure Note button at the bottom of your posts.

Thank you.

added and Cloudflare info will be added to the secure note soon

Hey Ashley,

We’re sorry for the back and forth pointing to Cloudflare here but when my colleague checked your site, he only used MacOS and Chrome where the issue doesn’t happen.

On Chrome Windows and the rest of other devices, the issue happens and this is not due to Cloudflare. It’s because there’s a double scrollbar that is why the page gets stuck but it does not exist in Chrome.

The solution for your case is to set the Overflow option of the Footer Bar to Hidden. See the video in the secure note showing the double scrollbar fix.

Please apply the solution to all your Footer Bars.

Thanks.

Thank you very much! That fixed the issue! We are so relieved.

We are also having an issue with the header. On mobile, the hamburger menu gets stuck. You can’t see clicks in this video, but several times the hamburger button is clicked on the menu doesn’t load. (time 1:111 especially is a good example.) Additionally, you can see that the hero images take a long time to load (this happens on mobile and desktop). How can we fix the hamburger menu, and what can we do to fix the slow loading issue of the hero images?

Hey Ashley,

The hamburger and the slow image issues are separate from the scrolling issue and it’s strongly recommended not to mix topics in a thread as it often leads to confusion and further back and forth. I’ll just comment on them but if you have further questions, please open a separate thread for different topics.

Regarding the hamburger, the page needs to completely load before you can click on any Javascript-powered feature like menus. What’s taking the page to load slowly could be the slider (Slider Revolution). Try opening a different page without the slider and see if the hamburger will open the Off-Canvas quickly.

Regarding the image, this is not a theme issue. You will need to improve your overall website performance. We have an article about it but since the scope of the topic is beyond the functionality of the theme, we cannot provide further guidance. See https://theme.co/docs/how-to-improve-site-performance

Hope that helps.

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