How to Fix the W3-Total-Cache CSS Minify Bug

Speed. As I mentioned back here the Thesis theme applies a date stamp to CSS files when they’re updated.

It does (did) this in order to ensure the latest version of your site is always displaid to visitors.

Unfortunately that process confused the life out of the W3-Total-Cache plugin (because it had the effect of creating a new filename) and you had to add the ‘new’ CSS files to the minify section whenever you made any changes to your site.

Which was a bit of a pain.

But, because of that, when the latest version of W3-Total-Cache came out a couple of weeks ago and destroyed the styling and layout of my sites, I just assumed it was related to the Thesis date stamp.

However, Chris Pearson released Thesis 1.8.1 a few days ago in which he removed the process of date stamping CSS files.

So I upgraded all my sites only to find that the layout and styling was, once again, destroyed.

The cause and the solution

It turns out there’s a bug in W3-Total-Cache which is preventing it from caching CSS files properly.

When you add your CSS files to W3TC (by caching them) they’re not separately uploaded to the browser and, because of the bug, W3TC is not presenting any CSS files either. The result is a destroyed layout.

The immediate workaround is simple:

  1. Switch the Minify mode on the General Settings page from auto to manual
  2. Remove all the CSS files from the Minify settings page
  3. Empty each of your Caches

You’ll now be good to go, but be sure to check your site from the ‘outside’ – meaning log out of your admin area and clear your browsing history before checking it as if you were a first time visitor.

Your CSS files are not being cached with these changes but at least your site is functional, and the other caching functions are working properly, so you are getting a good proportion of the optimsations.

I believe a new version of W3TC, which addresses this problem, is in the works and will be released shortly.

Update – 31 May, 2011

A new version of W3TC was released today. I’ve updated all my sites and the CSS bug is fixed – everything is working fine now. If you’re still experiencing the problem make sure you update to W3TC 0.9.2.2 (or later, of course).

Cheers,

Martin Malden

 

What do you think?

Comments on this entry are closed.

  • Eric May 30, 2011 @ 19:40

    Nice one Martin!

    I noticed that W3 Total Cache released an update today as well.

    I have had similar issues with loading my CSS files and any changes. But my issues were related to using CloudFlare. I found that I can select a Development mode and clear all my caches to see my revised CSS online.

    • Martin May 30, 2011 @ 19:57

      Thanks Dude,

      How are you finding CloudFlare..? I took a quick look but have been too busy with other stuff to spend any time on it…

      Cheers,

      Martin.

  • Aurore May 31, 2011 @ 0:58

    Thank you very much!! You helped me a LOT with this trick. W3T had become a pain in my blogging life.
    Cheers!

    • Martin May 31, 2011 @ 7:44

      You’re very welcome 🙂

      Glad it was helpful,

      Cheers,

      Martin.

      • Mahesh Rathi Jun 1, 2011 @ 21:46

        Yes Martin every thing working fine after updation of sites and Css is fixed.

        • Martin Jun 1, 2011 @ 22:25

          Good – well done,

          Cheers,

          Martin.

  • Nurul Imam Jun 3, 2011 @ 4:37

    Thanks for bugs information on W3 Total Cache
    I Update W3 Total Cache Version To 0.9.2.2 and stable

    • Martin Jun 3, 2011 @ 6:54

      Good – you’re welcome!

      Cheers,

      Martin.

  • marvin Jun 13, 2011 @ 12:32

    Bam… I thought I’m forced to removed w3tc on our Church’s website.
    Thanks for this, I was able to fix the lay out issue I am having with our Church’s website..

    • Martin Jun 14, 2011 @ 16:42

      Well, there you go – well done 🙂

      You should have upgraded to 0.9.2.2 – it works like a charm!

      Cheers,

      Martin.

      • marvin Jun 14, 2011 @ 20:08

        That’s weird. I have 0.9.2.2 but I still have to do the fix you gave on your post in order to solve the problem.. Well, it’s solved now, I hope w3tc won’t break again.. 🙂

  • Greg Dec 9, 2011 @ 10:32

    Interesting subject and post.I have had many problems with W3Total cache and Thesis Theme.
    Can not use Object cache and then minify.All posts seem to be for older versions of Total Cache
    My site was nearly ruined using w3total cache.
    Many bloggers have fared wordse though!
    Now the problem to uninstall the monster of a plugin

    Thanks for your info though’
    Greg

    • Martin Dec 10, 2011 @ 7:22

      Hi Greg,

      Although the Thesis date stamp did cause a problem (which was fixed in a subsequent release of Thesis), the problems are more likely to be caused by clashes between W3TC and your server configuration.

      I’m with Hostgator and they gave me instructions on how to set up W3TC to work most effectively with the server config that they use.

      If you haven’t done so already, it may be worth asking your hosting provider what their recommended settings are.

      Cheers,

      Martin.

  • Nichole Feb 24, 2012 @ 0:14

    I just want to say THANK YOU for this post! I thought my site was broken ‘forever’ after I gave up on the W3 Total Cache plugin and deleted it. But I followed your tips and everything is back to normal!

    Thanks so much!

    • Martin Feb 24, 2012 @ 8:17

      You’re very welcome – glad it helped! 🙂

      Cheers,

      Martin.