How To Set Up 301 and 302 Redirects for your WordPress and Divi Website

How To Set Up 301 and 302 Redirects for your WordPress and Divi Website
Possibly the greatest joy of using a CMS such as WordPress is the ability to add to and evolve a website. As your website grows over time, you might need to move around a few pages and restructure old content. This typically involves setting up new URLs or possibly changing your permalink structure. But what happens to the old URLs that are now deemed irrelevant to you, but are still relevant to your site visitors? Also, what happens if your website expands so much that you require an entirely new, more relevant domain name?

Ensuring that your website’s URLs are displaying and operating correctly is imperative as broken links and misdirected traffic can have a serious negative effect on both user experience and SEO. When moving URLs (websites, pages, posts and other content types) from an original to a new source, redirection is vital for steering both site viewers and search engines in the right direction.

In the event that no redirect has been set up for a web element (site, page or post), your site user will be met with an error message while browsing your site. They will more than likely leave your website, and possibly not return. In a similar vein, a search engine will also have no context over which web element to return in a search query.

The following blog post will explain the nature of HTTP redirects, the difference between the primary (301 and 302) redirects, and will offer a quick tutorial on how to set up 301 and 302 redirects using the .htaccess file. If you’re familiar with the theory of redirects, simply click here to jump to the code. There are a number of plugins that allow you to set up redirects easily. A number of these are mentioned at the end of this blog post.

Note: As best practice, it’s not advised to update and move URLs haphazardly. Redirects should only be set up when absolutely necessary.

3XX: The Different Types of Redirects

When a web user browses through a website, a call to the website’s server is made and the URL specific page is returned or displayed. If the server request returns with an error (defined by a series of numeric codes), this indicates that the requested resource has been moved to another URL. If a redirect is set up, the user will be forwarded to the correct URL.

The series of numeric codes are HTTP response status codes, and they signal a redirect of sorts. There are a vast number of HTTP response codes, the redirection specific codes consist of three digits and are prefixed with the number 3. If you ever stumble across ‘3XX’ or ‘30X’ when reading about websites, servers and such, it’s more than likely referring to one of the several HTTP response status codes. Each one of these codes is used for different redirection tactics and have different properties. Over time, and with the version update from HTTP/1.0 to HTTP/1.1, these response codes have evolved and split in order to serve a myriad of different purposes (largely taking browser caching as well as request methods POST / GET into account). At present, there are nine redirection status codes (300 – 308).

Without delving into too much detail about the redirect codes, the most important ones are 301 and 302. These have long been the most trusted methods for moving both permanent and temporary URLs respectively. Redirect codes 303 and 307 (temporary) and 308 (permanent) carry significance in their own regard, but not for the purpose of this post, and should only be used with finite knowledge in relation to the code-specific request methods.

What is a 301 Redirect?

A 301 redirect should be set up when a resource has been permanently moved from the original URL to the new URL. When visiting the original URL, site users will automatically be rerouted to the new URL. The new URL completely takes over the old URL, and the old URL will be removed from the Google search index. With this, search engines will ascribe value to the new URL.

Use a 301 redirect if:

  • You would like to move your web domain.
  • You would like to steer traffic to a new website, page or post from the original source.
  • There is a broken URL on your website.

What is a 302 Redirect?

A 302 redirect should be set up when a resource has been temporarily moved from the original URL to the new URL. Essentially, this is used as a detour, where traffic will temporarily be sent to the new location, and after time, the old location will be used.

Use a 302 redirect if:

  • You are updating a specific web page and want to divert traffic to a new page temporarily.
  • You are split testing either design, content or functional aspects (often for client decision and approval).
  • You are setting up an online campaign or landing page.
While the 301 redirect is clear, the 302 is a bit more complicated and has a back story. Initially, the 302 redirect was somewhat misused, as various browsers were interpreting the 302 redirect differently (with some browser changing the request method, either GET or POST). Later, the codes 303 “See Other” and 307 “Temporary Redirect” arose to define further parameters of temporary URL redirection, each with strict rules relating to whether the redirects were able to change or keep their request methods. With this, the 302 took on the “Found” designation, signaling that an object had been moved, and can be found in a specific location.

Despite the number of temporary redirects, the 302 is the most widely accepted option as it provides compatibility for browsers that don’t support HTTP/1.1, whereas 303 and 307 are used explicitly for HTTP/1.1 browsers.

Below the surface, redirection can become extremely complicated, but at the end of the day, the foolproof route is to stick with using 301 for a permanent redirect and 302 for a temporary redirect.

How to Set Up a 301 Redirect Using the .htaccess File

301 redirects can easily be set up by modifying the code in the .htaccess file for websites running on an Apache server. In the event that your server is not running Apache, it is advised to contact your host and query the nature and location of the file containing the mod_rewrite function.

Once a new WordPress installation is complete, a file – .htaccess – is, in most cases, automatically added to the root folder of a website. On some occasions, there is no .htaccess file, but one can easily be created by using a text editor or IDE (Brackets or Sublime) and then transferred to the root folder via FTP.

The .htaccess file gets read before the index.php file (which begins to load the full WordPress file package to display a website). In a very generalized sense, the .htaccess file is a config file that is somewhat predominantly focused on the functions of the server and can handle a series of requests including rewrites for redirects.

Remember to back up this file before making any changes. The code in the .htaccess file is extremely sensitive, and one incorrect character can throw an entire website off.

To edit your .htaccess file you will need to login to your server using an FTP client (such as FileZilla or CyberDuck). Some hosts allow for onsite file editing via the File Manager (or similarly named) console. Once you have located the .htaccess file in the root folder of your website, the file should present content that looks like this:

# BEGIN WordPress

RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]


# END WordPress
In some cases, the code may look different if certain plugins are added to the website.

301 Redirects for Pages or Posts

If you have moved a page or post URL, add the following code to the .htaccess file.
# BEGIN 301 Redirects
Redirect 301 /old-page-name/ https://www.website.com/new-page-name/
# END 301 Redirects
Remember to state the redirect code (301) which signals a permanent redirect. Also, remember to insert your domain into the www.website.com section as well as the relevant page and post names, and change the .com to a relevant extension if required.
In the event that you require more than one page or post URL redirects, add the same line of code between lines 1 and 3 – as seen in the example below. The # signals a comment block (not actually registered as the code itself, merely signaling instructions or documentation of updates).
# BEGIN 301 Redirects
Redirect 301 /old-page/ https://www.website.com/new-page/
Redirect 301 /old-page-2/ https://www.website.com/new-page-2/
Redirect 301 /old-post/ https://www.website.com/new-post/
# END 301 Redirects

301 Redirects for Domains

If you are moving an entire domain (i.e. olddomain.com to newdomain.com), add the following code to the .htaccess file to ensure that the old domain points to the new one.
  RewriteEngine On
  RewriteCond %{HTTP_HOST} ^olddomain\.com$ [OR]
  RewriteCond %{HTTP_HOST} ^www\.olddomain\.com$
  RewriteRule (.*)$ https://www.newdomain.com/$1 [R=301,L]

Again, enter the relevant domain names where olddomain and newdomain are listed, and change the .com to a relevant extension if required.

302 Redirects for Pages or Posts

Similarly to the 301 redirect, the 302 code is entered in the same way, with just the correct redirect code (302) specified:
# BEGIN 302 Redirects
Redirect 302 /old-post/ https://www.yourwebsite.com/new-post/
# END 302 Redirects
Once you’ve updated the .htaccess file, either save it directly from your File Manager console or use the FTP client to transfer the new file across to your root folder. To test the redirection, simply visit the old URL.

Set up Redirection Using a Plugin

If you’d like to avoid editing the .htaccess file to set up redirects, you can use a plugin. The following plugins have not been tested, but have been listed here as they are mentioned frequently by other sources writing on the topic of redirection.

To summarize, fully understanding redirection can lead you down a rather complicated rabbit hole, but for the majority of the time, using 301 and 302 redirects will suffice for the shifting of permanent and temporary URLs respectively. Again, it’s not wise to move URLs around haphazardly, and this process should only be done if deemed 100% necessary. Finally, exercise extreme caution when editing the .htaccess file (or similar) as a small error can shut down your website. Remember to back up the .htaccess file before editing any code.

Continuing the trend of redirection, this blog post will be followed with a post that both explains the 404 HTTP response status and includes a short tutorial on how to set up a 404 page for your Divi website.

We hope that you’ve enjoyed reading this blog post. Please feel free to share any comments or queries below, we love hearing your feedback.

Thanks for reading!

Lisa-Robyn Keown

Lisa-Robyn is a qualified copywriter and brand strategist from Cape Town, South Africa.