Wednesday, 16 February 2011

Changing CSS on an already published page

Implenting CSS changes could be a pain if the user doesn't refresh - which they will not know to do.
One quick way to force a client to load the latest css is to rename it. The problem here is that you need to update your pages to point to the CSS (not a big problem if you use a modular design.)
 
You could also keep the same filename and pass a query param:
e.g.
href="styles.css?v=1000"

Simply update the parameter value when you change the CSS file.

Rather than having to update the parameter, you can use a server side function:
<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); echo '?' . filemtime( get_stylesheet_directory() . '/style.css'); ?>" type="text/css" media="screen, projection" />