Modal Icons not opening when clicked right away and Modal Content Broken upon Opening (Random Issue When Icons Opens)

Hi,

I’m having issues regarding the icons not being clickable when you click it right away upon first load of the site.

If you wait a couple of seconds, before clicking, it begins to work and you are now able to open the modal.

Another issue is broken modal content which randomly occur when clicking on the icons.

I have attached the broken modal content I’m referring to:

Search Icon
Screenshot_1-4-2026_02922_baysidejetdrive.com

Location Icon

Phone Icon

This is happening to other sites we handle as well, sometimes with the hamburger button not opening up.

I’m not sure if this is WP Rocket Related. Please let me know if there is something we need to exclude in WPR.

I’ve tried excluding these:
/wp-content/themes/pro/(.).css
/wp-content/themes/x/(.
).css

But unfortunately the issue still seems to persist.

Hello @mercadeoconsult,

Thanks for writing to us.

In order to help you with your concerns, we need to check your settings. I would request please share the admin login details. Meanwhile, I would suggest you troubleshoot a few of the common issues before we investigate your settings. Please share your details in a secure note. Please provide the following details

  • WordPress Login URL
  • Admin-level username and password
  • Exact page URL

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

Thanks

Hello @mercadeoconsult,

It appears to be a cache issue. Please purge your caching plugin, clear your browser cache, and test again. I tested your website on my end, and it works on Chrome version 146.0.7680.177.

Thanks

Hi @prakash_s

Thank you for checking. This issue has been recurring, and we always solve this by clearing the cache.

Is there a way where we can solve this, so we won’t have to clear the cache always?

Or is this related to WP Rocket defer function?

Also, when testing this on chrome or edge, we use incognito, and that’s when the issue shows.

Please take note the issue only persists when the icons are clicked right away, by doing that, the icons are not opening. But when you wait a couple of seconds before moving your cursor or doing any activity, seems like the icons are clickable and the modal content shows up.

@ mercadeoconsult Caching is a service that runs on your server to increase the speed of the site to the end user.

Think of it as a copy of your site that is optimised to work VERY quickly. This “Copy” is refreshed every 24 hours typically.

Any changes you make aren’t reflected in this “Copy” and so you need to purge the cache after changes, this is a standard way of operating. The cache is important to keep your website fast. I personally would continue to use it and just make it part of your routine to purge the cache when you finish editing.

Hi @DonovanShores @prakash_s

Yes, thank you for that.

That is our standard procedure as well, however this issue keeps happening even though there are no changes made. So, I’m wondering if there is something cache related that is making the icons unclickable upon site load and breaking the modal content whenever you are able to click the icons.

Hey @mercadeoconsult,

The Dropdown and Modal components require JavaScript scripts, which are loaded at the end of the page. You must ensure that all page resources are fully loaded before any event is triggered—this also applies when clicking on the icons. While the page is loading, clicking on anything or triggering any event may not happen yet. You may need to optimize your page to make it load faster. Kindly check out this guide: https://theme.co/docs/how-to-improve-site-performance

Best Regards.