Grow your CSS skills. Land your dream job.

Last updated on:

Prevent CSS Caching

WordPress:

<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); echo '?' . filemtime( get_stylesheet_directory() . '/style.css'); ?>" type="text/css" media="screen" />

bbPress:

<link rel="stylesheet" href="<?php bb_stylesheet_uri(); echo '?' . filemtime( bb_get_active_theme_directory() . '/style.css'); ?>" type="text/css" media="screen" />

Adds stylesheet with time of last update. If the number changes the browser updates the CSS instead of using cached version. Easily amended to be none WP specific.

Comments

  1. In WordPress,

    filemtime(get_bloginfo( 'stylesheet_url' ));

    Will fail, apparently because get_bloginfo('sylesheet_url') returns an absolute path and that upsets the filemtime() function.

  2. Permalink to comment#

    I’m trying to move a website to a different server, downloaded all the files the new company put them up for me but I have lost all my css formatting for my theme (striking). Can find where the original developer of the website make the changes to header sizes, link colours etc etc. Could you help me maybe. Please

  3. Permalink to comment#

    And for your JS…

    
    <script type="text/javascript" src="<?php echo get_bloginfo('template_directory') . '/js/script.js?' . filemtime( get_stylesheet_directory() . '/js/script.js');?>"></script>
    
  4. Christian Sciberras
    Permalink to comment#

    Agustin….on the contrary…it fails because it returns a path relative to document root…

  5. Martin Klasson
    Permalink to comment#

    I am getting a “Stat”-php error for the example given above.
    The solution that I worked out that was working for me was this:

    <link rel="stylesheet" href="/css/style.css?version=”>

    What I have done is used the dirname(_FILE_) to get the path to the directory. Not the URL, but the PATH on the computer.

    The code above is used for my custom css-class. (I dont use the default css), but can easily be amended of course to work along with the stylesheet_url as well.

  6. Murdoc
    Permalink to comment#

    Thank you, sir! This is exactly what I have been looking for!

  7. Permalink to comment#

    There is a plugin up on the WordPress Plugin Repository that takes care of this automatically. Fixes version numbers for stylesheets and scripts. WordPress plugin Versions. Works really good.

    • scott

      only problem is it renders your site completely blank. uninstalled. thanks for the panic.

  8. Permalink to comment#

    This is exact copy paste from Mark’s site, without any reference. You have only changed the subject and added the bbpress stuff…. rest everything is same

    http://markjaquith.wordpress.com/2009/05/04/force-css-changes-to-go-live-immediately/

  9. Permalink to comment#

    I released a plugin that just works doin’ the drink, it’s Style.css Load Last Version plugin for WordPress.

    Cheers,

  10. John
    Permalink to comment#

    Hello guys!

    For those who uses WooThemes Canvas, child theme, and want to automatically add version to custom.css file, here is the code (put it in your functions.php):

    View in Pastie.org

    Thanks to Tiago Noronha, for WooThemes Support Team.

    Cheers,

  11. Kenny

    I know this is old, but for WordPress, in your functions.php file, why not just pass NULL to the version parameter of wp_enqueue_style?…It will do the same thing without having to hard code the link into the header, if no dependencies use null as well…

    wp_enqueue_style('your-theme', get_template_directory_uri() . '/style.css', NULL, NULL, 'screen');
    
    • Kenny

      of course that is, if you would like to prevent in dev stage…when you push live remove the nulls and the version num will pop back in again…

Leave a Comment

Current ye@r *

*May or may not contain any actual "CSS" or "Tricks".