2

When I update the style.css in my active child theme, the changes are not immediately picked up.

I tried doing a touch on the file, but the results have been inconsistent. It worked once, but did not work the next time. The changes were recognized after waiting for some time (~15 minutes). I checked the file timestamps and they

Is there something else that I need to do to let WordPress know that the style.css file has been updated for the current theme? Is the browser's concept of time involved in the decision to include changes from the style.css file?

Note: I am using the wp-enqueue-style() approach instead of the @import method for including the parent style.css.

Update: I do refreshes on the browser side every time I update style.css.

3

The problem is that you stylesheet is cached by your browser. This is no problem specific to WordPress, but will happen with every resource that you open in browser. The second thing that can (and probably will) be happening is that you have some sort of server side cache. You can work around your webservers caching, by hitting Ctrl + R or the same with Ctrl + F5 – as long as your server sends a proper Cache-Control header, else it won't work as your servers cache will refuse to react on commands from the outside world (your client/browser).

Aside from that, you can tell the server that you have a new resource every time you have a change to your stylesheet. This can simply be done by appending a query argument like ?<key>=<value>. The easiest way to do so, is to append a UNIX timestamp of the last time your file was modified:

add_action( 'wp_enqueue_scripts', function()
{
    wp_enqueue_style(
        'child-style-css',
        get_stylesheet_directory_uri()."/style.css",
        false,
        filemtime( get_stylesheet_directory()."/style.css" )
    );
}

This will produce an HTML tag like the following, where the query argument appended is ver and the value is 1456786622:

<link rel="stylesheet" 
    type="text/css" 
    href="https://example.com/wp-content/themes/your-theme/style.css?ver=1456786622">
  • Thank you. I did not see your comment about server-side caching until after I added my own answer. Also, I don't quite understand the second paragraph - how does query argument figure into the code you have provided? Possibly I just don't have the necessary PHP background. – Sabuncu Feb 29 '16 at 21:32
  • @Sabuncu See update. For the rest, you might want to exhibit how your server actually adds the Cache-Control header so you don't have localized knowledge for a single hoster with a GUI. – kaiser Feb 29 '16 at 22:58
  • Kaiser, thanks again. The "false" in the wp_enqueue_style() call - what is the syntax for that? It follows a literal string but there's no separating syntactical element. – Sabuncu Mar 1 '16 at 12:36
  • @Sabuncu I copy/pasted that quickly from another answer and seems like the origin had no commas. One line is one argument – fixed. Btw, developer WordPress resources, which includes source code. – kaiser Mar 1 '16 at 12:48
  • Whew! Thanks, I am already apprehensive about learning PHP, and I was really spooked by that syntax. :) – Sabuncu Mar 1 '16 at 13:37
1

It is probably because your browser is caching your css file. Try to reload with ctrl+F5 or for mac cmd+shift+r.

  • Just a F5 reload or a clear cache reload ctrl+f5? Are the changes visible in the css file if you go to it through you browser? – Jorin van Vilsteren Feb 29 '16 at 20:47
  • Per your suggestion I have tried CTRL+F5 but it did not help. – Sabuncu Feb 29 '16 at 20:57
  • Are the changes visible if you load the css file in your browser? – Jorin van Vilsteren Feb 29 '16 at 20:58
  • Just enter the url of your stylesheet in your browser. something like http://www.yoursite.com/wp-content/themes/your-theme/style.css – Jorin van Vilsteren Feb 29 '16 at 21:00
  • Didn't realize you could do that! Yes, the contents of the file are up-to-date when I look at it through the browser. But on another tab (Chrome), the site is out of date. – Sabuncu Feb 29 '16 at 21:03
1

The culprit was the server-side cache system used by my service provider (SiteGround). Their cPanel has a cache-flush device; using it solved the problem:

enter image description here

This stackoverflow question also helped.

Here's a link to the SiteGround page describing the system: SiteGround static cache

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.