Force the browser to fetch a new style.css each time the page is loaded

I'm constantly making new changes and then migrating them to my live site, even minor adjustments!
This can however, be quite bad..

My clients, friends, random internet warlocks.. they all see old CSS, or none at all, for new content and containers.
HTML changes, PHP changes, CSS stays the same!

This is due to the cache time, your browser will use the default expiry time of a file that hasn't changed and with CSS this seems to be used even if changes were made!

 

In a previous post we went through how to add your own CSS file and make a browser fetch it each time, but why not the default style.css?
Well.. It's not good practice to force the user to fetch new stylesheets each time, this is not a long term solution..

 

Check your functions.php, where it references and enqueues your stylesheet we need to change the second to last value (the version) to:

time()

This will add the time as the version, so every second you go up a new version number!
Each time the page is reloaded you're sure to get a new CSS copy without clearing the cache or force refreshing.

Here's that in full.

wp_enqueue_style('freshlondon-style', get_stylesheet_uri(), array(), time(), false);
Filed under: 
© 2021 - FreshLondon