How to Enable GZIP Compression in WordPress @ TwentySixForty

Tutorial Overview.

This tutorial will explain what GZIP Compression is and how to enable it on your WordPress website. It will also explain how to check if your website is already using GZIP Compression and two different methods to enable it.

Quickies.

What is GZIP Compression?
Is GZIP Compression Is Already Enabled on Your Website?
Enable GZIP Compression with a Plugin.
Enable GZIP Compression in WordPress Programmatically.

What is GZIP Compression?

GZIP compression is a way to compress website files for quicker transfer time from the server to the browser. When someone visits your website, they send a request to the server that your website is on to see your site. With GZIP compression enabled, your server will send back zipped files which will make your website load faster.

Is GZIP Compression Is Already Enabled on Your Website?

Go here: Gift of Speed.
Enter your website address into the box.
Hit the search button.

This tool will tell you if you have GZIP compression enabled, the number of bytes you are saving with compression, and a number of other details about your website.

How to Enable GZIP Compression in WordPress with a Plugin.

There are a number of WordPress plugins that will help you easily enable GZIP compression. Many of the WordPress caching plugins have the ability to do it including WP Rocket.

How to Enable GZIP Compression in WordPress Programmatically.

Unless you are already using a plugin that offers GZIP compression I would recommend using this method. I use this method because I like to keep my plugins to a minimum.

Make an FTP connection to your website. Detailed instructions here: How to Make an FTP Connection with FileZilla.
In the root of your WordPress website locate the .htaccess file.
Select the .htaccess file to edit.
Enter this code below the current contents of the .htaccess file:

Note: The .htaccess file is a hidden file. If you do not see this file you may need to adjust the setting in your FTP client. In FileZilla go to Server in the top bar and select “Force showing hidden files”.

<IfModule mod_deflate.c>
  # Compress HTML, CSS, JavaScript, Text, XML and fonts
  AddOutputFilterByType DEFLATE application/javascript
  AddOutputFilterByType DEFLATE application/rss+xml
  AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
  AddOutputFilterByType DEFLATE application/x-font
  AddOutputFilterByType DEFLATE application/x-font-opentype
  AddOutputFilterByType DEFLATE application/x-font-otf
  AddOutputFilterByType DEFLATE application/x-font-truetype
  AddOutputFilterByType DEFLATE application/x-font-ttf
  AddOutputFilterByType DEFLATE application/x-javascript
  AddOutputFilterByType DEFLATE application/xhtml+xml
  AddOutputFilterByType DEFLATE application/xml
  AddOutputFilterByType DEFLATE font/opentype
  AddOutputFilterByType DEFLATE font/otf
  AddOutputFilterByType DEFLATE font/ttf
  AddOutputFilterByType DEFLATE image/svg+xml
  AddOutputFilterByType DEFLATE image/x-icon
  AddOutputFilterByType DEFLATE text/css
  AddOutputFilterByType DEFLATE text/html
  AddOutputFilterByType DEFLATE text/javascript
  AddOutputFilterByType DEFLATE text/plain
  AddOutputFilterByType DEFLATE text/xml
  # Remove browser bugs (only needed for really old browsers)
  BrowserMatch ^Mozilla/4 gzip-only-text/html
  BrowserMatch ^Mozilla/4\.0[678] no-gzip
  BrowserMatch \bMSIE !no-gzip !gzip-only-text/html
  Header append Vary User-Agent
</IfModule>