Ultimate guide to Enable Gzip compression in WordPress

Ultimate guide to Enable Gzip compression in WordPress

Ultimate guide to Enable Gzip compression in WordPress

Ultimate guide to Enable Gzip compression in WordPress-: Website speed performance has a very important role in SEO because Google lists a website higher in search result that load faster. A slow website also disappoints your website user. There are many methods to speed up your WordPress website like using Cloudflare CDN, Lazy loading of Images, Compression of Images etc. In this post, I will talk about Gzip compression.

Compression allows your webserver to provide smaller file sizes which load faster for your website users. Enabling gzip compression is standard practice. If you are not using it for some reason, your web pages are likely slower than your competitors.

How to Enable GZIP Compression in WordPress site Hosted on Apache Server-:

Ultimate guide to Enable Gzip compression in WordPress

Enabling GZIP compression for your WordPress site by editing your .htaccess file This is the most common way to enable WordPress GZIP compression. However, this particular method involves the possibility that you might break something.

After all, .htaccess is a very sensitive server file, and one wrong move can mess up your whole website, therefore, I always recommend taking a backup of your .htaccess file before editing it. You can edit your .htaccess file using two methods one is using your Hosting cPanel and other is using FTP client like FileZilla.

Add the following code, sourced from GTmetrix, below the sections marked by the # BEGIN WordPress and # END WordPress tags (beyond this, the specific location where you include the following code snippet doesn’t matter): add the following line of code to .htaccess file to 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 

If .htaccess file not present use the following method to create one with following Method-:

  • Log into your cPanel account.
  • Navigate to the File Manager section
  • Click on the + File menu option at the top left-hand corner
  • Type in “.htaccess” – without the quotes “” of course as the new file name and add the following code.
# 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 WordPres

Add the compression code in your .htacces file before # END WordPress or after # BEGIN WordPress the whole code will look like as shown.

# 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>
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 # END WordPres

Save the file and use it to replace your original .htaccess file. Then, run your website through a GZIP compression checker tool (or verify the response headers) GZIP compression checker tool to make sure that you were successful. 

Enable GZIP Compression in WordPress Hosted on NGINX-:

Ultimate guide to Enable Gzip compression in WordPress

While most Shared Hosting Plans come with Apache web servers, you may be using something else, such as NGINX. there are very few hosting companies like Kinsta which offers NGINX server for WordPress Hosting.

NGINX is a free, open-source, high-performance HTTP server and reverses proxy, as well as an IMAP/POP3 proxy server. NGINX is known for its high performance, stability, rich feature set, simple configuration, and low resource consumption. NGINX is one of a handful of servers written to address the C10K problem.

Enabling GZIP compression for NGINX web servers is slightly different from modifying the .htaccess file available to you if you were running on an Apache webserver. If you’re running on NGINX (like Kinsta), you can enable GZIP compression in WordPress by looking for your nginx.conf file and adding the following code:

gzip on;
gzip_disable "MSIE [1-6]\.(?!.*SV1)";
gzip_vary on;
gzip_types text/plain text/css text/javascript image/svg+xml image/x-icon application/javascript application/x-javascript;

Thanks for reading…“Pardon my grammar, English is not my native tongue.”

If you like my work, Please Share on Social Media! You can Follow WP knol on Facebook, Twitter, Pinterest and YouTube for latest updates. You may Subscribe to WP Knol Newsletter to get latest updates via Email. You May also Continue Reading my Recent Posts Which Might Interest You.

 

Share the Knowledge!
  • 160
  • 123
  •  
  •  
  •  
  •  
  •  
  •  
    283
    Shares
Amar Patel on FacebookAmar Patel on PinterestAmar Patel on TwitterAmar Patel on Wordpress
Amar Patel
Hi, I am Amar Patel from India. Founder, Author and Administrator of wpknol.com. I am a Simple Average Man who Loves life and Love living life.Professionally I am a Mechanical Engineer. Apart from my Job, I Love to write the things around WordPress WordPress CMS.
Enter your email address: Delivered by FeedBurner
Follow us on Social Media