Thesis Development Power-Tip — How To Disable CSS Caching In Thesis During Development

As a web developer you might already be aware of caching — browser caching to be more precise. It is one of the top recommendations to optimize and speedify your website. With browser caching you explicitly instruct the browser to fetch the files from the local cache instead of requesting the files from the server again.

Thesis version 1.8.1 effectively implemented CSS caching to optimize the page loading times for subsequent user visits (and thus improve the performance of websites powered by Thesis). Besides this, enabling caching significantly reduces the bandwidth and hosting costs for your site as well.

However, the change brought in a caveat; when you are developing the website, you need to aggressively refresh the website to view the changes made to custom.css. Temporarily cisabling the CSS caching help you save refresh keystrokes and ensures intended result every time you load the page after editing the stylesheet. You need to add the filter called ‘thesis_cache_query’ to disable CSS caching. Add the following code to custom_functions.php to disable CSS caching and thus view the updated version of CSS every time you load the site pages. [Learn how to edit custom_functions.php here]


function cache_customcss()
{
return true;
}

add_filter('thesis_cache_query','cache_customcss');

Once the website is ready to go live, you can again enable the caching by removing the filter to benefit your site from the cache-friendly feature of Thesis 1.8.1 (or higher). Neat eh?

Posted In:

Latest Posts — WordPress Support & Maintenance, Code Snippets, Thesis WordPress Theme Framework

1 Comment

  1. you just saved my sanity…thank you 🙂

    Reply

Comment on Thesis Development Power-Tip — How To Disable CSS Caching In Thesis During Development

Your email address will not be published. Required fields are marked *