CSS Not loading properly for mega menu in theme version 3.3.4?

Hello @wpjeremy,

I fully examined the issue you have raised on this topic and could not see it on my end. How can we replicate your steps to arrive at the issue on a fresh WordPress installation?

For troubleshooting, please do the following steps and let me know the results:

1- Head over to WP Dashboard > Plugin.
2- Deactivate all plugins.
3- Then, first activate the Ocean Extra plugin.
4- Check your issue.
5- Then, activate your plugins one by one
6- After activation of any plugins, check your issue

Note: if you have any cache plugin or server cache(CDN / Browser Cache and Cookies and …), you need to clear its cache contents or disable them to see your changes. Also, don’t forget to click on the regenerate all assets file and data in Elementor > Tools.

Please keep us posted.
Best Regards

Hi,

I had thought this issue had gone away with a rollback to the earlier version of the theme. It had from the browser perspective.

However, now I am seeing Googlebot smartphone complain about pages not being usable on mobile.

The same rendering oddity is seen in the preview of what the bot is able to render.

I have this javascript console error:

Uncaught TypeError: a is not a function at https://www.domain.com/wp-content/themes/oceanwp/assets/js/vendors/magnific-popup.min.js?ver=1.0:4:374 at https://www.domain.com/wp-content/themes/oceanwp/assets/js/vendors/magnific-popup.min.js?ver=1.0:4:73 at https://www.domain.com/wp-content/themes/oceanwp/assets/js/vendors/magnific-popup.min.js?ver=1.0:4:147
https://www.domain.com/wp-content/themes/oceanwp/assets/js/vendors/magnific-popup.min.js?ver=1.0:3

Image of the render: https://pasteboard.co/JyZN2w6mx3ug.png

I am continuing to investigate my side, but would appreciate any input.

Jeremy

• This reply was modified 2 years, 6 months ago by wpjeremy.

Strangely using this tool doesn’t produce the same issue: https://technicalseo.com/tools/fetch-render/

Page renders as I would expect.

Hello @wpjeremy,

?This issue is related to the performance of your website. In this case, you need to do the following items:

1- Minifying Assets:
To reduce all website assets files, use minified tools, combine tools, and cache plugin(s). Do all of them in one package. They should upload all images, CSS, and JS lighter.

2- Priority of the assets:
All stylesheets should be loaded in the head tag, and all scripts should be loaded in the footer. So please make sure the assets’ priority is correct. This screenshot shows that the styles have not been loaded yet: https://pasteboard.co/JyZN2w6mx3ug.png.

I found another link with helpful content that can help you in this regard: https://gtmetrix.com/wordpress-optimization-guide.html.

And in the end, please don’t forget to read this article: https://web.dev/fast/. After solving the desktop issue, please do them for mobile; to check the mobile website, use this link: https://pagespeed.web.dev/, like this: https://i.postimg.cc/CLjBn4pt/image.png. And check the “PageSpeed Insights” suggestions to find solutions for specific issues.

Best Regards