WP tip – Forcing a CSS stylesheet refresh

WP tip – Forcing a CSS stylesheet refresh

The scenario

A project is close to completion, then there’s this one thing the client wants changed. You can totally do it. Easy peasy.

Now, if you build a site with code, and not mouse clicking, then you would have edited the stylesheet.

So you change a couple of values and/or properties on the stylesheet.

Cool. Plus, you clear the cache.

All good?


The situation

The people who checked the previous version of the site have the cache on its local storage, and you can’t make everyone use the incognito browser to check the un-cached version of the website to confirm that it’s been changed.

So they only see the version before the stylesheet change.

Hit refresh, nope. Nothing changes. Nope.




So now you got a bunch of people asking “Did you REALLY make those changes? I can’t see them, I refreshed the browser” and so on… until it’s been taken care of.

Make it stop.

The solution

(Disclaimer: You usually won’t be having this problem if you use the additional CSS tab in the customizer, but if you style a whole website, it’s better to actually code the whole thing properly, and not add a couple of quick snippets to the theme, so this solution doesn’t apply to short CSS snippets in the additional CSS field. It’s for large CSS files in the WP enqueue.)

Alright, this is actually way simpler than it seems.

And that’s good, because I had so much frustration with this.

Here’s how to get it done.

Step 1. Connect to your server, go to your child theme folder, and to the folder with the stylesheet.

Step 2. Duplicate the CSS file, and name it something different. Like with a 2 at the end.

Step 3. Now go to functions.php and change the name of the enqueued CSS file to the new one.

And… you’re done.


That’s it. The browser will have to load the new stylesheet because it realizes it’s a different file.

PS. I’ve read that this works with adding CSS file versions too, but I couldn’t get it to work with my setups reliably, so I just go with a full filename change.



Photo by Justyn Warner on Unsplash

Leave a Reply

Your email address will not be published. Required fields are marked *

  1. Hi,’
    You can try the below option in your function.php. No need to rename and save.

    add_action( ‘wp_enqueue_scripts’, ‘my_theme_enqueue_styles’ );
    function my_theme_enqueue_styles() {
    wp_enqueue_style(‘main-styles’, get_template_directory_uri() . ‘/style.css’, array(), filemtime(get_template_directory() . ‘/style.css’), false);

    • Hi Muhammad, That’s very interesting. Thanks!

  2. I will definitely try this trick. I have dealt with this issue for years and I always tell customers to hit CTRL and F5 if on a PC (Command and R on a Mac, but I know that doesn’t work on Safari).

    • I was really happy when this trick worked! Hope you like it!

New tutorials

Why no ads?

Hi, I'm PK, and I maintain and publish content on this site for two reasons.

  1. To give back to the community. I learned so much from people's tutorials and StackOverflow that I wanted to contribute and help others.

  2. To provide a more structured learning experience. People struggle to find the course that guides them from start to finish, based off of real life experience, and my courses provide that.

The only "ads" I have here are for my own courses, and maybe an affiliate link, but that's it. They fund the website resources and provide more motivation for me to produce better content.

Any bit of interest helps. Even sharing with your friends, suggesting my courses to your developer or designer, or subscribing to my YT channel, or joining our Discord. Thanks and I'll see you around!

There's a newsletter!

Sign up to the newsletter for the occasional updates on courses, products, tutorials, and sales.