WordPress Made Easy

How to Add Expires Headers in WordPress

Would you like to know how to add expires headers to your WordPress posts?

Expires headers tell web browsers whether to load a web page resource like pictures from the visitor’s cache or from your server. These can aid in the optimization of your website’s performance.

In this article, we’ll show you how to add expires headers to WordPress in two different ways.

In WordPress, How Do I Add Expires Headers?

In WordPress, How Are Expires Headers Used?

When someone visits a page on your WordPress site for the first time, all of the files are loaded one by one. All of these requests between the browser and the WordPress hosting server lengthen the time it takes for a web page to load.

Some or all of those files are cached on the visitor’s computer by browser caching. That means the files can be loaded from their own computer the next time they visit the page, enhancing your WordPress performance.

Now you might be wondering how browsers determine which files to save and for how long.

Expired headers are useful in this situation.

Expires headers or cache-control headers are used to specify which files should be saved and for how long. We’ll focus on expires headers in this article because they’re easier to set up for most users.

Each type of file kept in the browser cache has an expiration date determined by the expires headers. The files will be reloaded from your server after that date to provide visitors with the most recent version of the page.

Using two distinct ways, we’ll teach you how to add expires headers. The first technique is the most straightforward and is recommended for the majority of people.

Method 1: Use the WP Rocket WordPress Plugin to add Expires Headers.

WP Rocket is the most user-friendly caching plugin for WordPress on the market. It works right away to speed up your site once you enable it, without the need to fiddle with intricate setup settings like many other caching plugins.

WP Rocket is a premium plugin, but the best thing is that their cheapest subscription includes all functionality.

Rocket from HP

Installing and activating the WP Rocket plugin is the first step. See our step-by-step guide on installing a WordPress plugin for more information.

WP Rocket will automatically enable browser caching after it has been installed and active. It adds expires headers and cache-control headers with the optimal values by default to help your WordPress site load faster.

That’s all there is to it. If you want to learn more about WP Rocket, check out our tutorial on how to install and configure it in WP Rocket in WordPress.

If you’d rather utilize a free caching plugin to add expires headers to your website, W3 Total Cache is a good option.

W3 Total Cache has some of the same capabilities as WP Rocket, but it isn’t as user-friendly. You’d have to manually enable expires headers because they aren’t enabled by default.

Method 2: Using Code to Add Expires Headers to WordPress

Adding code to your WordPress files is the second way to add expires headers in WordPress. We don’t recommend it for beginners because a coding error could result in major issues and cause your site to crash.

We recommend that you back up your WordPress site before making any modifications.

With that said, let’s look at how to add expires headers to WordPress using code.

Find out whether your website is powered by Apache or Nginx.

To begin, determine whether your website runs on Apache or Nginx servers. To do so, go to your website and right-click the page, then choose ‘Inspect’ from the drop-down menu.

Right-click the Inspect Option and select Properties.

After that, go to the top of the website and pick the ‘Network’ tab. It’s possible that you’ll have to refresh the page to see the results.

Toggle to the Network tab.

After that, go to the top of the ‘Name’ column and click your domain name. Then scroll down to the ‘Response Headers’ section and look for an item named’server.’

Look at the section on Response Headers for more information.

This will reveal which web server is currently in use. The site is hosted on a Nginx server in this example.

Adding Expires Headers to Apache

You must add code to your.htaccess file to add expires headers to an Apache server.

To edit this file, use an FTP client or your host’s file manager tool to connect to your WordPress hosting account. Your.htaccess file is located in the root folder of your website.

In the Root Folder, look for.htaccess.

To enable browser caching, you must first add expires headers. This instructs the web browser as to how long it should keep your website’s resources before deleting them.

To add expire headers, place the following code towards the top of your.htaccess file:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
## EXPIRES HEADER CACHING ##
<IfModule mod_expires.c>
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 3 days"
</IfModule>
## EXPIRES HEADER CACHING ##

Most sites should be good with these settings, but if your needs are different, you can change the time periods.

The code sets multiple cache expiration dates depending on the file type. Because images are frequently the same, they are cached for longer than HTML, CSS, Javascript, and other file types.

Adding Expires Headers to Nginx

If you’re hosting your WordPress blog on a Nginx server, you’ll need to add expires headers to the server configuration file.

The way you edit and access this file is determined by your host, so if you need assistance, contact your hosting provider.

Then, to add expires header, you must add the following code:

1
2
3
4
5
6
7
location ~* \.(jpg|jpeg|gif|png|svg)$ {
  expires 365d;
}
 
location ~* \.(pdf|css|html|js|swf)$ {
  expires 3d;
}

The expiration times for the various file kinds will be specified by this code. Notice again that images are cached longer than HTML, CSS, JS, and other file types since images normally stay the same.

We hope this post helped you understand how to implement expires headers in WordPress.

Comments are closed.