Cache-busting the WordPress stylesheet

Update: My friend Russell has a more evolved version of this, viewable here: Cache-busting Path Plugin for WordPress. I’ll probably still use mine, as I’m trying to limit the number of outside functions I’m including, but if you’re looking to add cache-busting into your blog, I’d suggest running with his.

This isn’t new, but it always takes me longer to find the right code for this, so I thought I’d write up a quick thing for my own use. If it helps you, cool.

WordPress, in a helpful attempt to reduce server hits, caches the CSS file for your blog. Since I do a lot of in-browser tweaking, I like to make a change to my CSS file and see it reflected on the site immediately, just to make sure it’s looking the way I want it to. WordPress, by caching the file, makes that hard.

So, I just add a timestamp to the end of the CSS file … exactly how Rails (up to 3.1) did.

<link rel="stylesheet" type="text/css" media="all" href="<?php bloginfo( 'stylesheet_url' ); ?>?<?php echo time(); ?>" />

By adding the last part of that string (the bold text), it means that the CSS file is fetched new on each pageload.

Obviously, once you finish your re-designing and want to use the blog in production, you’ll want to drop the cache-busting code. But while you’re designing it, that can be helpful.

Monday, May 30, 2011 — 8 notes
  1. tecnologia-android reblogged this from charliepark
  2. joeconyers said: I usually just turn off css caching via addons.mozilla.org/en-U… or use xrefresh.binaryage.com to magically reload the css - but good idea for all dev servers.
  3. charliepark posted this