How to Manually Configure WordPress Browser Cache?

disadvantage of wordpress plugins

By on March 17, 2018

Website Cache Implementation is one of the effective ways to make sure the site loads faster for the users. For better results, browser must cache the exact element for better results. Even if you are installing a cache plugin, you won’t have full control over the setting, so you must configure it manually.

Configuring the cache manually in wordpress is very simple and it just needs few changes in .htaccess file. Below I have explained  the advantages of cache implementation and how to configure it manually in wordpress.

google pogo sticking effect

Browser Caching is a Good Idea

For the first time, if a user visits your website then some of its content will get stored in a browser locally. So from next time, if a user opens your website then the stored website contents will help to load it faster. This method is called browser caching and this is how it helps to load your website faster.

  • It will reduce your server load. Since the repeated users will load the data from the browser, the number of requests sent for a browser will be very low. So it doesn’t need to work hard to transfer the content for each request.
  • Decrease Your Bounce Rate. Bounce rate of a website depends on its performance and so it is more important to provide the website which loads in seconds.
  • Increase Your Page Speed. If the website is loaded from the browser, then the time taken to request and receive the data will be very low. So ultimately it increases the page speed of your website.

Also you must be very clear that, your entire website is not stored as a cache and instead of that some important or static contents will be stored in the browser. As there are many sites which uploads the interactive contents frequently and so it won’t get reflected in the main website.

wordpress plugins disadvantages

Simple Steps to Configure Your Browser Cache Manually in WordPress

#1. Access your .htaccess file

You need to edit your .htaccess file and it will be present in your wordpress installation directory. To access .htaccess file, you must have cpanel or FTP access.

If suppose you have the cPanel Access, then it is very simple to edit the .htaccess file present in it. But suppose if you want to edit it through FTP, then you must need some third party software like Filezilla.

Once after getting into the WordPress Installation directory within public_html folder, you can find .htaccess file. Suppose if it is not visible then you must tick the checkbox “Show Hidden files”.

If it is a wordpress website then it must have some default .htaccess file with the below content.

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress

It is not so complicated to edit the htaccess file to enable the browser. It is very simple as explained in the second step.

browser cache

#2. Edit & Add Codes in htaccess file

Simple configuration to enable the browser cache for your website. You want to add the below codes to your .htaccess file. As most of the website or a webpage is very heavy due to more images and video contents. So by setting the expiry date for long time will help you to store the content in a browser.

 <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"
 </IfModule>

Here the images with extensions like jpg, jpeg, png and gif were set to expiry for 1 year. Also sometimes you may not change the scripts and html files reguary so you can play with the time duration ser for the expiry. In below code, it is mentioned to add expired time as 1 week for javascript and html files. So it will be effective to store the website files in the browser and also helps to load the site faster.

<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 text/html "access 1 month"
 ExpiresByType text/x-javascript "access 1 week"
 </IfModule>

Also in addition to this, you can add the extra codes like ExpiresDefault “access 1 month” in addition to the above. Enabling cache plugin and enabling the option through checkbox is very easy but you won’t have full control over the cache system. So just through the simple steps, it will be very much effective to implement the browser cache manually in wordpress.



Leave a Reply

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

Learn the SEO Tactics Fernando Used To Rank #1 For "SEO Consultant" In UK

Learn the SEO Tactics Fernando Used To Rank #1 For "SEO Consultant" In UK

Enter your details and get the same guide Fernando uses for SEO.

You will receive an email with the Guide shortly!