WordPress – Leverage Browser Caching with .htaccess

0
5298

Leverage Browser Caching means storing static files of a website in visitor browser. And then retrieving them from browser quickly instead again from server. Actually it uses to speed up each page of a website. Here is the guide how to Leverage Browser Caching with .htaccess. Be sure you have a recent, good backup of your site you can use to restore from if an update or upgrade goes horribly wrong.

As a bare minimum, you add the following in your .htaccess. To do this, simply access your hosting cPanel, and with your File Manager to do the update. Steps as below:

  • Access the File Manager by clicking on the File Manager icon within your cPanel. This can be quickly located by typing File Manager into the search bar at the top of the cPanel.
  • In the top right of the screen, click the settings button. Ensure the option that states Show Hidden Files is checked and click save at the bottom of the window.
  • Once you can see your hidden dot files, navigate to the domain’s file path by right clicking the .htaccess file, and then selecting Edit.
  • Once in the edit mode for the .htaccess file, paste the following Cache-Control Headers and Expiring Headers code each on a new line within the .htaccess file.
    <IfModule mod_expires.c>
    ExpiresActive On
    
     # Images
     ExpiresByType image/jpeg "access plus 1 year"
     ExpiresByType image/gif "access plus 1 year"
     ExpiresByType image/png "access plus 1 year"
     ExpiresByType image/webp "access plus 1 year"
     ExpiresByType image/svg+xml "access plus 1 year"
     ExpiresByType image/x-icon "access plus 1 year"
    
     # Video
     ExpiresByType video/mp4 "access plus 1 year"
     ExpiresByType video/mpeg "access plus 1 year"
    
     # CSS, JavaScript
     ExpiresByType text/css "access plus 1 month"
     ExpiresByType text/javascript "access plus 1 month"
     ExpiresByType application/javascript "access plus 1 month"
    
     # Others
     ExpiresByType application/pdf "access plus 1 month"
     ExpiresByType application/x-shockwave-flash "access plus 1 month"
    </IfModule>
  • After the code above has been added to the .htaccess file, Do not make any other changes, click the save button at the top right corner of the screen. Boom, you are done!
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments