0

The CSS on an existing WordPress page won't update. I've uploaded and overwrote several files via SFTP. All PHP files were accepted, the CSS file too. However, it doesn't show up. The banner and some other CSS rules don't show up.

This is the page online: https://zerocarbon-analytics.org/climate-change-glossary Online Version

and this is how it looks on my local version: Local Version

What's odd is that, if you look into the WP theme code editor, you can see that the CSS rule that is meant to load in the JPG, is there. Which means, the CSS was overwritten and updated. WordPress Theme Editor CSS

You can also see that the rule .page-banner__bg-image_glossary is there. However, in the same screenshot you see that below - the exact info of that CSS rule is missing in Chrome developer tools. Developer Tools Inspect Google Chrome

I took the same CSS rule from an already existing page - and there a) it works b) the info is visible in the developer tools. Other banner, where it works

Based on some StackOverflow suggestions I've tried:

  • clearing WordPress cache
  • clearing browser cache
  • hard refresh cmd+shift+r
  • clearing server cache on CloudWays
  • clearimg CDN cache on CloudFlare
  • tried differnet browsers, and incognito mode
  • check for spelling mistakes - to the best of my ability

Does anyone have a similar issue with WordPress? Does anyone know what else this could cause this?

Thank you!

Lizzzardking
  • 21
  • 3
  • Why does it say `page_banner__bg_image_glossary` in green before the `.page_banner__bg_image_glossary` in your screenshot of the CSS in the editor? This means the selector you are actually using there, is `page_banner__bg_image_glossary .page_banner__bg_image_glossary` - of course that doesn't find anything. – CBroe Jun 06 '23 at 12:29
  • @CBroe - sorry, that was just me just copy/pasting the selector in there first and then on to here when i wrote the text on SO. Ignore it please, it isn't in the actual code. / I'll update the image. – Lizzzardking Jun 06 '23 at 12:39
  • 1
    Your current stylesheet comes with `last-modified: Thu, 18 Aug 2022 11:46:49 GMT` in the response, so I am guessing this is probably still a Cloudflare issue, and that you need to keep looking there. – CBroe Jun 06 '23 at 12:42
  • Can I ask how you retrieved this information? This would be super helpful. @CBroe – Lizzzardking Jun 06 '23 at 12:45
  • Use your devtools Network tab to help troubleshoot this. There's a checkbox to disable the browser cache. I've never been able to troubleshoot a site successfully without disabling Cloudflare or whatever other caching CDN is in use, for what it.s worth. Most cache plugings come with some sort of checkbox `[x] Disable cache for logged-in users`. That's a good way to proceed. – O. Jones Jun 06 '23 at 12:45
  • Thanks you CBroe. and O. Jones - both of the ideas were helpful and I solved the issue. It was indeed CloudFlare - apparently the webmaster has 3 other domains registered and they were blocking the CSS. I purged cache on all 3 of them and it works now. – Lizzzardking Jun 06 '23 at 13:02

0 Answers0