How to gzip on WordPress

Posted on

To gzip files on a WordPress website, you can enable compression through the server configuration or by using plugins. Gzipping files reduces their size, resulting in faster load times and improved overall performance for your site visitors. This process involves modifying server settings or using plugins specifically designed for WordPress to handle compression tasks seamlessly.

Server Configuration for Gzip Compression

Many web servers, including Apache and Nginx, allow you to enable gzip compression directly through their configuration files. This method is typically preferred for its efficiency and reliability. Here's how you can enable gzip compression on different servers:

Apache Server

  1. Access Your .htaccess File: Locate and edit the .htaccess file in the root directory of your WordPress installation. If you cannot find it, make sure your file manager is set to show hidden files.

  2. Enable Gzip: Add the following lines to your .htaccess file to enable gzip compression for various file types:

    <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>
    
  3. Save Changes: Save the .htaccess file and refresh your website to apply gzip compression.

Nginx Server

  1. Edit Nginx Configuration: Locate your Nginx configuration file, often named nginx.conf or default.conf. This file is typically found in /etc/nginx/ or /etc/nginx/conf.d/.

  2. Enable Gzip: Add the following lines inside the http block to enable gzip compression:

    gzip on;
    gzip_disable "msie6";
    
    gzip_vary on;
    gzip_proxied any;
    gzip_comp_level 6;
    gzip_buffers 16 8k;
    gzip_http_version 1.1;
    gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;
    
  3. Save Changes: Save the configuration file and restart Nginx using sudo systemctl restart nginx to apply gzip compression.

Using Plugins for Gzip Compression in WordPress

If modifying server configuration files seems daunting, you can achieve gzip compression using plugins designed for WordPress. These plugins simplify the process and offer additional features to optimize your website's performance:

1. WP Super Cache

WP Super Cache is a popular caching plugin that also includes an option for gzip compression. Once installed and activated, follow these steps:

  • Go to Settings » WP Super Cache in your WordPress dashboard.
  • Click on the Advanced tab.
  • Check the box next to Compress pages so they’re served more quickly to visitors.
  • Save the changes.

2. W3 Total Cache

W3 Total Cache is another comprehensive caching plugin that supports gzip compression. Here’s how you can enable it:

  • Install and activate the W3 Total Cache plugin.
  • Go to Performance » General Settings in your WordPress dashboard.
  • Scroll down to the Browser Cache section.
  • Check the box next to Enable HTTP (gzip) compression.
  • Save the settings.

3. WP Rocket

WP Rocket is a premium caching plugin known for its user-friendly interface and powerful caching features, including gzip compression:

  • Install and activate the WP Rocket plugin.
  • Go to Settings » WP Rocket in your WordPress dashboard.
  • Click on the File Optimization tab.
  • Toggle the switch to enable Enable file compression.
  • Save the changes.

Summary

Implementing gzip compression on your WordPress site can significantly improve loading times and user experience by reducing file sizes transmitted over the network. Whether you choose to modify server configurations or use dedicated plugins like WP Super Cache, W3 Total Cache, or WP Rocket, enabling gzip compression is a crucial step towards optimizing your site's performance. By following these methods, you ensure that your WordPress site delivers content efficiently, benefiting both your visitors and your site's search engine rankings.