Page speed is one of the prominent factors for a blog or site. Because the sooner someone can find your blog post, the more likely they are to read it. Page speed also influences rankings on search engines like Google and Bing.
The speed of your site is determined by a variety of factors, and the speed test tools provide you with several ideas for improving them. However, the most common one is “add expires headers”
What exactly are expires headers, and how do you implement them on WordPress? Does that really increase your page speed?
What are expires headers?
Before knowing what the expires headers are, it’s better to know how the websites and browsers work.
When a person types in the URL, the browser connects it to the server where the site is kept and displays it.
Technically, it takes a few seconds to establish the connection with the server (this depends on a lot of factors like server speed, server deployed location, etc).
The same thing happens each and every time a person tries to view the site. However, this can be avoided for repeated visits.
For example, when a person visits your site, the browsers will cache (store) the files locally on your computer. so when the same person visits your site again, instead of contacting the origin server, the local files will be displayed. This way, the page speed will be dramatically increased for repeated visits.
The expiration period for the cached files is set by Expires headers.
When the expires headers are added, the browser will delete the file after x amount of days mentioned in it.
How to add expires headers in WordPress?
There are three methods for adding expires headers to WordPress. The first is via a plugin, the second is by using a CDN service like Cloudflare and the third is by manually adding the codes on your server.
Add expires headers on WordPress using Plugins
This is the simplest method to include headers into WordPress. The majority of caching software allows you to do this. As an example, let’s look at how it’s done in some of the most popular plugins, such as WP Rocket, Autoptimize, w3 total cache, and Litespeed cache.
However, choosing the best plugin is one of the crucial steps for a WordPress site. Rather than loading your website with numerous plugins, stick to the one that works best for you.
WP Rocket
By far, the simplest and best plugin for caching is WP Rocket. Purchase and install the plugin on your WordPress site. Activate the plugin once installed.
That’s it. Isn’t it that simple?
The plugin automatically applies the best settings (including expires headers) to improve the page speed. This is why I said WP Rocket is the simplest plugin for caching.
However, the plugin is a premium one, and if you would like to go for free once, the following alternatives would be excellent choices.
W3 Total Cache
This plugin is quite opposite of WP Rocket because it’s more advanced and requires some technical knowledge to use. But don’t worry, let me teach you how to add expires headers with a few clicks.
First things first, install and activate W3 total cache. There will be a lot of options to configure, but for this example, we’ll just turn on expires headers.
- On the left sidebar on your WordPress dashboard, hover your mouse over the performance and select the browser cache.
- Under general, tick “Set expires header“. This will add the expires headers to your site. However, you can also set the headers for individual files such as images, CSS, or Javascript.
- To do so, simply scroll down to discover the appropriate categories. Under those, check the box “set expire header” for the categories you wish headers to be added. You can also specify the duration of the header in the “expires header lifetime” field.
- Finally, save all the settings and check the page speed score.
Humming Bird
Humming Bird is also one of the best caching plugins, though it is less popular owing to its excellence.
Once the plugin is installed and activated, It will switch on your site’s expires headers automatically. By default, the expiration time will be four hours, which is somewhat low.
To increase it, head over to hummingbird -> caching
Check the expiration duration under the status. If it is already set to a year, there is nothing for you to do. If not, scroll down and change the expiry period to one year under the configuration section.
However, if the one-year period is unsuitable for you, you may change it to something more suitable but keeping it at least 6 months long is recommended.
Litespeed Cache
Litespeed cache is one of the most popular cache plugins used to improve the performance of WordPress sites. The plugin was developed especially for LiteSpeed servers but It can be used with any other server.
The plugin will be installed by default if you’re using the Litespeed server. However, if you’re using any other server like Apache or Nginx, you can install it like any other plugin.
- Go to the Litespeed -> cache on the left sidebar of your WordPress site.
- Select the browser under the Litespeed cache settings.
- Switch on the browser cache and modify the duration of the cache if you want to.
- Finally, save the changes to enable the cache
Add expires headers on WordPress using Cloudflare
Cloudflare protects your website against hacking, DDoS attacks, and other malicious activity. It also provides web optimization and improves your site’s performance by caching static content in its content delivery network (CDN).
Since Cloudflare supports caching, the expires headers can be added. Follow the below steps to integrate Cloudflare with your WordPress site.
If your site is already connected with Cloudflare, you can skip this section.
- Create a free account on Cloudflare and add your site. You’ll be prompted to pick a plan, choose the free one, and continue.
- Now the Cloudflare will scan the DNS records of your domain. Simply click continue.
- Change the name servers on your domain registrar to those displayed by Cloudflare. You can find the options to edit the DNS under DNS settings on most of the registrar.
- Save the changes and wait for them to propagate. Mostly, this will be done within 10 minutes but sometimes, it might take up to 48 hours.
By these steps, Cloudflare will be integrated with your site. Once done, Cloudflare will run a simple wizard to optimize your site.
On the wizard, Cloudflare will ask you to activate caching for each item such as images and CSS. Check them all and save the settings.
This will turn on the browser caching and will add the expires headers to your site. However, to modify the duration of the caching, follow the steps below.
- On your Cloudflare dashboard, click caching at the top column.
- Click configuration and select the duration of the cache under the browser cache TTL.
The changes will be automatically saved.
Add expires headers on WordPress manually
This method involves coding. To do so, you’ll need some technical know-how and abilities. I don’t recommend newbies to follow this approach because it’s risky and may break your site.
The way in which a method is implemented will vary from server to server. It differs based on which web server you’re using: Apache or Nginx.
If you’re not sure which server you’re using, there are a few approaches to finding it. The simple method for determining your site’s server is to go to Netcraft and put in the address of your site.
The tool will pull in all the information about your website. Check what server your site is built on in the SSL/TLS section.
Apache:
In this server, the codes should be included in the .htaccess file on the root folder.
You may either log in to your web host’s file manager or use an FTP client like Filezilla to access your WordPress files.
If you can’t find the .htaccess file, make sure to check on the public_html folder.
Edit the file in a text editor and add the following codes at the top.
## EXPIRES HEADER CACHING ##
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 image/svg "access 1 year"
ExpiresByType text/css "access 1 month"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/javascript "access 1 month"
ExpiresByType application/x-javascript "access 1 month"
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"
## EXPIRES HEADER CACHING ##Ngnix:
The Ngnix server does not have the same .htaccess file as Apache, instead, a configuration file will be present.
Moreover, the location of the file will vary depending on your host. Contact them to find out where the file is located.
Edit the configuration file of your server and add the following codes
location ~* .(jpg|jpeg|gif|png|svg)$ {
expires 365d;
}
location ~* .(pdf|css|html|js|swf)$ {
expires 2d;
}Litespeed:
For LiteSpeed, the procedure would be similar to that of Apache. Modify the .htaccess file using the code I mentioned.
However, It’s preferable to use Litespeed’s default cache plugin to enable expires headers on Litespeed servers.
Conclusion
These are the methods for adding expires headers to your WordPress site. Using plugins rather than hand-coding is preferable. If you’re comfortable with codes, you can try to add them manually, but keep in mind that a single error may wreak havoc on your website.
If you have any questions, please do not hesitate to ask me in the comments below. or visit the forum.
Affiliate Discloser: This post contains affiliate links. If you purchase anything using these links, I will get a commission for the referral at no extra cost to you. Moreover, I only recommend things that I have personally used and always offer my honest opinion.
Featured Image by freepik
