W3 Total Cache, CDN and theme files

I updated the style.css file of my WordPress installation recently. The change were effective: when logged in as an administrator (my blog is set so that the administrator is never served a cached version of the site, but a “live” one), I can see them.

But my blog is being served through a CDN (using W3 Total Cache). Through the CDN, the changes are not effective: the CDN does not serve the modified files from my theme. Even though I’ve uploaded them after modification (Dashboard>Performance>CDN>Upload theme files.

Read More

My CDN runs on AmazonCloud Front. And Minify is disabled on W3 Total Cache.

The theme file being served through my CDN is a compressed version: style.css.gzip

Should I “purge” objects from my CDN or wait a little more (it’s been more than a week). And yes, I empty the cache of the browser I’m using to see in the changes are taking effect. Or is there something else I’m missing?

Thanks,

P.

Related posts

Leave a Reply

3 comments

  1. You need to either

    1. Version your files (by calling it style.css?ver=xxx.xxx) and making sure your CloudFront distribution has “Forward Query strings” turned on. This is the better option, as it means that all you need to do is increment the number in the query string and CloudFront will fetch this file automatically.

    2. Manually invalidate your files via the AWS Console (there is an invalidation tab when you edit your distribution)

    To turn on ‘Forward Query Strings’ do the following:

    • Edit your Cloudfront distro by ticking the checkbox on the left of the ‘i’ and then click on the “distribution settings” button in the toolbar
    • Go to the Behaviors tab
    • Select the line, and click on ‘Edit’
    • Change “forward query strings” to Yes
    • Click on “Yes, Edit”
  2. There’s a pretty simply “trick” to prevent caching, when file contents changed: Add a version number, that is set to the latest date/time you changed your file.

    add_action( 'wp_enqueue_scripts', 'wpse61738_non_cached_stylesheet' );
    function wpse61738_non_cached_stylesheet()
    {
        wp_enqueue_style( 
            'style-main',
            get_stylesheet_directory_uri().'/style.css',
            array(),
            filemtime( get_stylesheet_directory().'/style.css' )
        );
    }
    

    This will append ?ver=0123456789 to your style.css reference link in your header. The version number will only change, when the files contents get modified. So you have a solution that works perfect with a) server side cache b) browser cache and refreshes automatically.

  3. a short answer …

    1. Delete all your theme files and re-upload them. some times the delete action clears the CDN

    2. Yes, you could try Purge — but Delete and re-upload is usually quicker.

    3. Also check out the settings in W3TC and in Amazon. The default Cache for in W3TC is usually 365 days. which is 31536000 seconds 🙂

    In Amazon .. there will be a setting for endpoints to re-query the CDN. i know in Rackspace the default is 24 hours.