Wordpress - How to change version of .css in WordPress?

The fourth argument, $ver for wp_enqueue_style() allows you to set the version:

wp_enqueue_style( string $handle,
                  string $src = false,
                  array $deps = array(),
                  string|bool|null $ver = false,
                  string $media = 'all' );

Per the docs:

$ver (string|bool|null) (Optional) String specifying stylesheet version number, if it has one, which is added to the URL as a query string for cache busting purposes. If version is set to false, a version number is automatically added equal to current installed WordPress version. If set to null, no version is added. Default value: false


Mostly theme's use wp_enqueue_style() function inside their functions.php file to add style sheet in the header. Here is how to find out if your theme does the same.

Open your wp-content/themes/YOUR_THEME_NAME/functions.php file, and find out the line which is adding the style sheet, Like:

wp_enqueue_style('main_style',  get_stylesheet_directory_uri() . '/style.css');

Or Like:

wp_enqueue_style( 'twentysixteen-style', get_stylesheet_uri() );

You can search for the ID (except for -css part)... if the ID is: main_style-css search for just main-style in your functions.php file, and you should probably find the line of code you were looking for.

Now that you found the code and you know that your theme adds this stylesheet by using wp_enqueue_style() in functions.php file. You need to update this code for version.

$style_ver = filemtime( get_stylesheet_directory() . '/style.css' );
wp_enqueue_style( 'main_style', get_stylesheet_directory_uri() . '/style.css', '', $style_ver );

As you can see, this code gets the last modified time of style.css file using filemtime() PHP function and it also converts the time to timestamp using time() PHP function just to make things clean.

If you don't want the version to dynamically change every time you can simply do this:

wp_enqueue_style( 'main_style', get_stylesheet_directory_uri() . '/style.css', '', '1.5' );

Thats pretty much it. Peace!


I didn't get much out of these answers so I thought I'd write what worked for me. I know the codex says:

$ver (string|bool|null) (Optional) String specifying stylesheet version number, if it has one, which is added to the URL as a query string for cache busting purposes. If version is set to false, a version number is automatically added equal to current installed WordPress version. If set to null, no version is added. Default value: false

But it is very cryptic as to how it actually works. I could not get a version number in wp_enqueue_style to trigger a query param like ?ver=1.2.3 on my stylesheet. However setting it to true allows the stylesheet's declared version to cache bust the stylesheet. (read on)

Within your style.css you must name your theme. This is required by WP. However other options such as version is what wp_enqueue_style's version boolean gives reference too.

/******************************************************************
Site Name: MySite.com
Author: @BenRacicot
Version: 4.0 // <- wp_enqueue_style's version number
Stylesheet: Main Stylesheet
******************************************************************/

Now when I change that to Version: 4.1 I get style.css?cache-bust=0.24135995238933283

Tags:

Css

Recent Posts