WordPress puts food on my table.

Force CSS changes to “go live” immediately

If you update your WordPress theme’s style.css, you may have noticed that you have to “force-reload” your site in your browser to see the changes. This is because your browser keeps a copy of the CSS cached on your hard drive. Depending on how your server is set up, it may not check for a new version of the stylesheet for a couple hours, or longer! And even if you force-reload to see the changes, visitors who have previously accessed your site may still get the old CSS. One way to solve this is to “version” your CSS file, by adding ?v=123 to the URL in the <link /> to your stylesheet. This is rather a pain to have to do by hand every time, so here is a much better way:

I have WordPress running on Apache on it’s own server, and a separate server running Nginx that serves static files such as the CSS.

Is there a way to check the file time stamp from the WordPress/Apache server to the Static/Nginx server over http without PHP running on the Nginx server?

Also, since many of the static theme files run on the Nginx server, which also serves images, the Turbo function will not work in my WordPress control panel. It would be nice to be able to define a path to files for Gears to search for the files on remote, and local, servers at the same time.

@demetris: you’re right, that should actually be calling bloginfo(’stylesheet_url’). Also, instead of using the TEMPLATEPATH constant, get_stylesheet_directory() would be much better, since it takes into account any plugins that hook into the ‘stylesheet_directory’ hook.

Or, now that I think about it… you could just add a filter on the ‘stylesheet_uri’ hook to append the timestamp. Then it would work on any theme without modification, provided that they are properly calling bloginfo(‘stylesheet_url’), which I think most do.

This is not a very good solution. You lose the advantage of caching which is one of the benefits of having an external stylesheet. Now your stylesheet has to be downloaded and parsed on EVERY PAGE LOAD which means longer page load and rendering times. This hurts your users’ experience on your site. It also means your eating unnecessary bandwidth. And for what? So your users get a new styleheet IF you happened to have made changes to it recently? Does your stylesheet really change THAT often? Is caching really that much of a problem? Almost certainly not.

Browsers caching stylesheets is rarely a real problem and this solution is overkill. I definitely don’t recommend it to anyone who doesn’t have a VERY dynamic stylesheet (i.e. ones changes very, very frequently. I mean every few minutes or so).

John, are you referring to the solution in the very first post? If so, it’ll only invalidate the cache if the style sheet is modified. If you only modify it every six months, then for those six months, the address to the style sheet will remain unchanged and it’ll be cacheable.

A change to the style sheet will change the modified time appended to the URL, which the browser sees as a “new” address and so will load the style sheet freshly from the server.

Either way works just as well as the other; the point is that the browser sees each as a specific URL so that when the string of numbers changes, it’s recognized as another distinct URL. This results in the style sheets being loaded fresh from the server.

YOU HAVE ABSOLUTELY HOW MUCH THIS HELPED ME.. WordPress was taking 5-10 minutes to reflect CSS changes no matter WHAT I did, even what computer or theme I used. It was driving me insane. This fixed it. It should be added to WordPress.. Thank you so much!

That way it uses the file modified time of the stylesheet and only changes the get request param when the file is changed. However if browsers really don’t cache any get requests, then I suppose you might as well just use ANYTHING in the query string and it will work in the same non-efficient way

Ask a WordPress Dev

Do you have an interesting WordPress-related question? Submit your questions, and I'll periodically pick the best one and answer it here on my blog! It can be anything from usage tips to hardcore WP development questions.