How do setup gzip & leverage browser caching properly on Wordpress

May 2, 2014 12.9k views
Hi, a newbie question, Wordpress on Ubuntu 13.10 one click install. thanks in advance
10 Answers
Did you enable mod_expires and mod_headers? And remember to restart Apache after changing its configuration. Run:

sudo a2enmod headers
sudo a2enmod expires
service apache2 restart

As for W3, I'm not sure what server side set up you're referring to, but at least for setting up gzip compression it works out of the box on the one-click Wordpress app.
The simplest solution is probably to use the W3 Total Cache plugin:

In the admin panel, go to Plugins -> Add New and search for "w3 cache" and click the install link. Now go to Plugins -> Installed Plugins and click the "activate" link. You should now see a new "Performance" menu in the sidebar of the admin panel. gzip compression should now be enabled. To verify that, go to Performance --> Browser Cache and make sure "Enable HTTP (gzip) compression" is checked. It should look like:

Hi again, w3 is so complex for me, it requires too much thing on server side and i am far from there... i just searched and i found .htaccess modification.

my .htaccess file like this, but browser caching doesn't work.
any advice?
thanks a lot
# BEGIN WordPress

RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]


# Enable expirations
ExpiresActive On
# Default directive
ExpiresDefault "access plus 1 month"
# My favicon
ExpiresByType image/x-icon "access plus 1 year"
# Images
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
ExpiresByType text/css "access 1 month"
# Javascript
ExpiresByType application/javascript "access 1 month"

AddType application/x-javascript .js
AddType text/css .css

SetOutputFilter DEFLATE

SetEnvIfNoCase Request_URI \.(?:rar|zip)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI \.(?:gif|jpg|png)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI \.(?:avi|mov|mp4)$ no-gzip dont-vary
SetEnvIfNoCase Request_URI \.mp3$ no-gzip dont-vary

Header append Vary User-Agent env=!dont-vary

# END WordPress

I run these three last commands and edited the .htaccess file for my Wordpress installation and now I'm getting a 500 Server Error :( Is there a way to revert this?

Hi again,

I've checked the Apache error log and this is what is causing the problem:

".htaccess expiresactive not allowed here"

I'm trying to find a solution online but can't find clear instructions. Will keep you updated if I finally can solve it.

Try running the following commands:
sudo a2enmod expires

sudo service apache2 restart
Hi there,

Thanks Kamal for this message. I forgot to add that I finally solved this problem adding 'Indexes' to the "AllowOverride" line in apache2.conf file:

Options FollowSymLinks
AllowOverride FileInfo Indexes

Now it's working fine :) Thanks a lot!


I am having a similar issue here. I have Ubuntu 14.04 with wordpress, apache2, mysql (the default wordpress application image from DO). Do I also need to add AllowOverride Indexes? If so where? I have many places where AllowOverride appears in my apache2.conf.

I am still getting this from google pagespeed:

Leverage browser caching
Setting an expiry date or a maximum age in the HTTP headers for static resources instructs the browser to load previously downloaded resources from local disk rather than over the network. (30 minutes)
.../media/js/count.js?ver=4.1.1 (2 days)
.../jetpack/modules/wpgroho.js?ver=4.1.1 (2 days)
.../plugins/monarch/js/custom.js?ver=1.2 (2 days)
.../monarch/js/idle-timer.min.js?ver=1.2 (2 days)
.../powerpress/player.min.js?ver=4.1.1 (2 days)
.../fontawesome-webfont.woff?v=4.2.0 (2 days)
.../fonts/titillium-light-webfont.svg (2 days)
.../fonts/titillium-light-webfont.woff (2 days)
.../fonts/titillium-regular-webfont.svg (2 days)
.../fonts/titillium-regular-webfont.woff (2 days)

Here is the config I put at hte bottom of my apache2.conf (yes expires and headers mods are enabled):

<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpg "access 1 year"
ExpiresByType image/jpeg "access 1 year"
ExpiresByType image/gif "access 1 year"
ExpiresByType image/png "access 1 year"
ExpiresByType text/css "access 1 week"
ExpiresByType application/pdf "access 1 week"
ExpiresByType text/x-javascript "access 1 week"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 month"
ExpiresDefault "access 2 days"

What am I missing? also gives me a terrible score for "leverage browser caching"

Have another answer? Share your knowledge.