Caching and Versioning for rtl.css

by

I am using filemtime() to add a version number for different .css and .js files in a custom WordPress theme.

I used the accepted answer described here as a guideline; however, I use the wp_retister_style() and wp_register_script() functions to register my .css and .js files respectively, and evetually load them via wp_enqueue_style() and wp_enqueue_script(). As an example, I am registering sigle.css file this way:

wp_register_style('xyz_single', get_template_directory_uri() . '/css/single.css', false, filemtime(get_template_directory() . '/css/single.css'));

The fourth parameter in the function above will add ?ver=nnnnnnnn to the stylesheet. The final output will be something like single.css?ver=nnnnnnnn, where nnnnnnnn is a number representing the timestamp of the modified file in order to esure reloading it when I modify the theme so caching issues are taken care off.

Now, to my question.

In my custome theme, I use rtl.css, which is loaded automatically for me when wp_head() is called. So how do I append rtl.css to include a version number?

More information

In header.php, I am loading style.css as follows:

<link href="https://wordpress.stackexchange.com/questions/177373/<?php echo get_stylesheet_uri() ."?ver=" . filemtime(get_stylesheet_directory() . "/style.css'); ?>" rel="stylesheet" type="text/css" />

I am loading all other stylesheets using wp_register_style() as described above, followed by wp_enqueue_style(). Here is an example:

wp_register_style('xyz_single', get_template_directory_uri() . '/css/single.css', false, filemtime(get_template_directory() . '/css/single.css'));

wp_enqueue_style('xyz-single');

However, rtl.css is automatically loaded when I call wp_head() in header.php. Please read this great article on how wp_head() loads rtl.css; and hence my question, how can I add a version number to rtl.css if it is called automatically?

2 s
2

You are loading the rtl.css using the WordPress automatic way, that is, having a rtl.css in the theme folder will be loaded by WordPress automatically if it presents and direction of current language ir rtl (you should add this information to the question, it has been difficult to figure it out how you are loading the file). This process defines locale_stylesheet_uri that you can use to modify the locale stylesheet URL, so you can add the version parameter to it:

add_filter( 'locale_stylesheet_uri', function ($localized_stylesheet_uri) {
    $time_ver = filemtime( get_stylesheet_directory() . '/rtl.css' );
    return add_query_arg( array('ver' => $time_ver), $localized_stylesheet_uri );
});

If you need also handle dependencies you will have to load rlt.css file with wp_enqueue_style just like any other css file. No way of handling dependencies with the “auto” way.

Leave a Comment