Global CSS getting ignored on the front-end when activating Yoast

[Misho]

Hi!

This is so strange. I had to remove RankMath from one website because it was creating problems and install Yoast. Yoast solved all the RankMath issue, but now the Global CSS is getting ignored on the front-end.

I have deactivated all other plugins to check for multi-plugin conflict. The issue persists with all other plugins disabled. I Don’t see related console errors either. It is not the Child Theme either, and it is not due to the new version of Yoast.

Could you take a look at it?
Thanks!

[mcostales84]

Pro has no integration, or almost no integration with an SEO plugin. I have similar issues. My solution is, every time I update the Meta Desc for any page, I go to Pro > Settings and hit Clear Cache Styles. That do the trick.
Good luck!

[Misho]

Thanks @mcostales84!

Clearing Style cache was one of the things I have tried. That doesn’t help unfortunately.

[marc_a]

Hi Misho,

Thanks for reaching out!

Since you are using WPEngine, I tried to Purge All the Cache then the Global CSS is now working on your front-end.

See the example checking below:

Global CSS:

Front-end:

Front-end with CSS media query condition:

Hope that helps.

Thank you.

[Misho]

Hi!

The .video-hero class is the one where I have noticed the issue. It is added to the Columns of the Hero sections where video can be found.

/treatments/ page would be one of them. Since the columns were getting collapsed due to the CSS not applying, I have inlined that CSS into the Columns with $el, so the sections are not collapsing now.

However, when I remove that CSS from being inline and let Global CSS handling it, it doesn’t get read despite the fact that it is present on the front end.

So, the video-hero CSS is setting the height of the column and other things. Inside the content Builder, it is properly read. On the front-end, it is not. When checking the source file, it is all there, like on your screenshot.

Totally strange. When I copy the Global CSS to a CSS tool on the front-end, it instantly gets applied. While the same one visible on the page source is not getting applied.

Thanks!

[ruenel]

Hello Misho,

The SmartVideo plugin could be adding that class to your video element on the page. temporarily deactivate the plugin and see how it goes.

Kindly let us know how it goes.

[Misho]

Hi!

Yeah, that looks suspicious. However, as I wrote above, I have tested with all plugins deactivated (Excep Yoast). Pro is conflicting with Yoast on this website even if all plugins are disabled, the child theme deactivated and all Custom CSS removed. I have also tested all individual Yoast settings to see if any particular one is a culprit.

The new issue I have noticed is that Global Blocks on some pages are getting unstyled as well, as long as Yoast is on.

Thanks!

[tristup]

Hi Misho,

Can you please specify the page URL(s) where the Global Blocks are not loading with the styles for further investigation?

Thanks

[Misho]

Hi!

Sure. It is the page /treatments/what-to-expect/. The Global Block is the one that says "Book a free consultations. It works in the content Editor.

Also this one: /treatments/adult-orthodontics/.

Here’s another one: /treatments/clear-aligners/.

At the same time, this Global block shows up normally on many pages. Like on this one: /treatments/.

I have tested removing all other sections from the page, but it isn’t that.

Thanks!

[tristup]

Hi Misho,

I checked the what-to-expect page and found the issue described in the mentioned section. I found that the related CSS is not loading for the section-specific class, which is loading in the treatment page. I went ahead and saved the section from the treatment page and load it in the what-to-expect page and found that it working. I would suggest you follow the same steps while facing this issue.

Thanks

[Misho]

That got them working! Funny how they are showing normally in the content editor.

The Global CSS is still not working but ok, I have inlined it where critical.

Thanks!

[tristup]

Hi Misho,

Glad that it is working now and you are able to find the cause of the issue.

Thanks