Redirection 301 and 302 in WordPress

There are times in which you may need to reorganize the content on your site, reassigning pages and articles to new topics or changing their URL. For instance you may want to refine a title or to reassign a post to a different (or brand new) category.

Those operations may affect the permalink of the article, and therefore visitors who bookmarked your post will be routed to a 404 error. Search engines may serve the old URL on search results. When the URL of a page changes, the SEO value accumulated by that page is also lost.

The best way to preserve rank and visits consists in notifying Search Engines that the resource is in fact still available at a new URL.

There are various solutions to achieve that goal. One is to edit the .htaccess file, another is to add a template page. But first, what is the difference between a 301 and a 302 redirection?

Status 301 or 302?

Search Engines are machines and we talk to them through status codes and numbers. The status codes for redirections are 301 and 302, where:

  • 301 is a permanent relocation, for instance when the page moves to a different domain.
  • 302 is a temporary relocation, implying that the page will be accessible in future at its original url, for instance when the site undergoes a phase of temporary maintenance.

We notify Search Engines that a content has moved speaking their language. In the case of a whole site moving at a new domain, I would resort to the file .htaccess.

redirectMatch 301 ^/ http://newsite.com
Or preserving the permalink structure.
RewriteEngine on
RewriteCond %{HTTP_HOST} ^www.oldsite.com$ [NC]
RewriteRule ^(.*)$ http://www.newsite.com/$1 [R=301,L]

But let us say you just need to redirect an article about coffee and caffeine to the new URL, and you want to use the file .htaccess for doing so. Then the following line will be sufficient.

Redirect 301 /caffeine/coffee-is-good http://yoursite.com/addiction/coffee-is-a-necessity

As told above, you can also use a code 302 instead of 301 if the relocation is only temporary.

Changing the url of a page can cause havoc

WordPress has an efficient and trivial solution for managing permalink. And often, if you notice, it can resolve by itself the change of a permalink to a post.

However, let us assume that you have an article under the category “Caffeine”, and at some point you decide that it has to belong to the category “Addiction”. You realize that the title of the article is misleading, so you change that as well.

Before the permalink of the page may have been:

http://yoursite.com/caffeine/coffee-is-good

And later it becomes:

http://yoursite.com/addiction/cant-live-without-coffee

At this point, since the SEO value of a page (its rank and other parameters) is linked to its previous url, you risk to lose it. If you want to transfer the value to the new page, you have to notify search engines that the address of the page has changed, providing the new URL, as we've seen above.

A more flexible approach for blogging

When I decided to give a new start to my personal blog, I had several articles that, even if interesting by topic, were in desperate need of a rewriting. In few cases I wanted to change title and permalink to the page. Obviously I wanted also to transfer the SEO value of the old pages, into the new one.

So, how did I do?

WordPress is pretty smart and is able to fix part of the issue by itself. However, it can't do it all, and I wanted a manageable method for redirecting contents directly from the Dashboard without losing the original entries. So I decided to go for a small custom function and a specific Custom Field (that I defined “redirect” – pretty straight forward).

Redirecting a Post Type

In order to easily redirect an visit to a page that has been moved, I now resort to the function here below. It accepts an URL, and as optional a status code (301, or 302). If no code is provided, the function assumes a default 302.

Those values have to be passed by via Custom Field as told previously, like so:

http://site.com/page-title

Or you can use one of the variations below. They all work.

  1. 301 http://site.com/page-title
  2. 302 http://site.com/page-title
  3. http://site.com/page-title 302

Pick up one of the lines above. They all redirect to http://site.com/page-title. And here is the function that makes it possible. Copy and paste it into the file functions.php, usually located into your theme folder.

/*------------------------------------------------------*/
/* my_redirect */
/*------------------------------------------------------*//*
It redirects a resource to a new location.

By default, the status code is set as 302 for temporary redirection, or use 301 for permanent redirection. The function requires a custom field in order to take action.
Otherwise it will go silent.

Custom Field Key -> 'redirect'
Accepted Values (status code separated by space from the url, if provided):
  -> 'http://site.com/page-title'
  -> '301 http://site.com/page-title'
  -> '302 http://site.com/page-title'
  -> 'http://site.com/page-title 302'

The status code has to be 301, or 302. Default 302.

Note: It needs to be on top of everything, before the doctype. Otherwise you will get a "Warning Cannot modify header information - ..."
*/

if ( ! function_exists('my_redirect')) {
function my_redirect( $url = '', $status = 302 ) {

  global $post;
  $protocols = array( 'http', 'https');
  $redirect = get_post_meta($post->ID, 'redirect', true);

  if ( $redirect ) {
    $parts = explode(' ', $redirect);
    if ( is_array($parts)) {
      foreach ( $parts as $k => $v ) {
        if ( strlen($v) == 3 ) $status = $v;
        if ( strlen($v) > 3 )  $url = esc_url($v, $protocols);
      }
    }
    if ( isset($url) && ! empty($url)) {
      wp_redirect( $url, $status );
      exit();
    }
  }
}} // END my_redirect

Now, where to use the function and how? For it to be effective on posts it has to be placed in the file single.php. That file is usually located inside the theme folder of your choice.

../wp-content/themes/YOUR-THEME/single.php

Open the file with a proper editor (TextEdit or Notepad will do a decent job), and add the following code, before anything else could be executed. Like so:

<?php /* Default Post Template */
my_redirect();
get_header(); ?>
<div id="content" class="site-content" role="main">
  <?php // the loop as usual... ?>
  ...few lines later...
</div>

Setting up custom fields

If you are a bit lost with the concept of Custom Fields, follow me, it is very simple to set them up on your WordPress site.

From the Post Editor (or Page Editor) click on the gray label on the top right of the page, with the title Screen Options. The click will slide a panel down. In there, check the one called Custom Fields.

Custom-Fields-01

Now, down the page you should find the panel for setting up your Custom Fields. On the field Name digit redirect, and on the field Value digit the url to where redirect that specific post of page. Optionally add a status code separated by a simple space from the url.

Custom-Fields-02

That should do the trick.

Redirecting a page

The procedure explained above should help you in redirecting posts and pages as well. For redirecting a page you have to modify the file page.php similarly to what have been shown for the file single.php.

Conclusion

Hopefully this short explanation will help in dealing with redirection and SEO.