Quick Tip: Improve your website’s 404 page

3 Comments

Controlling your visitor’s experience is important. One of the worst things to happen to a visitor is for them to find a “page not found” on your blog. It’s best if that never happens, of course, but in case it does you can at least offer the best user experience to these visitors as you can.

First, to make editing your 404 page easier, widget-ize it. Add a widget to your functions file and to your 404 template, and then you can edit the content of your 404 page from the widgets screen.

Creating another widget area

First, head to your functions.php file and add this code to add another widget area to your theme:

if ( function_exists('register_sidebar') ) {
	register_sidebar(array(
		'before_widget' => '<div class="widget %s"&t;',
		'after_widget' => '</div>',
		'before_title' => '<h3 class="widgettitle"><span>',
		'name' => '404 Page Content',
		'after_title' => '</span></h3>',
	));
}

That will add a new widget area called “404 Page Content” to your Appearance > Widgets screen.

Adding the widget area to your 404 page

Now head to your 404.php template. If your theme doesn’t have one, you will want to create it. Add the following code to the content area of the page to pull in the widget you created in the step above:

<?php if ( function_exists('dynamic_sidebar') && dynamic_sidebar('404 Page Content') ) : else : ?>

Now you should have a widget area on your 404 page that will make it much easier to customize it for your visitors.

Creating a helpful 404 page

First, add a message to your 404 page using a text widget explaining what has happened to your visitor. Avoid using “404″ in your message, since that status message won’t mean much to most people. Typically “page not found” makes more sense.

WPCandy uses the following simple message first:

Sorry, that page wasn’t found!

Sometimes a page moves or is deleted. We’re sorry you ended up here, but hopefully we can help you find what you’re looking for.

Secondly, add a list of your most recent posts, and maybe a link to your sitemap. It’s likely a new visitor is looking for something recently added to the site.

Third, provide a search option. Odds are the visitor knows what they were looking for, so they will know what to search for. Provide a link to a search page, or add your search form directly using the WordPress search widget.

Finally, provide a way for the visitor to contact you. If all of the above efforts have failed, they need to be able to let you know—and hopefully you want to find out there was a problem.

What about your 404?

Do you have a thoughtful 404 page? What techniques do you use on yours? Anything you would suggest to others?

3 thoughts on “Quick Tip: Improve your website’s 404 page

  1. Isn’t if ( function_exists('register_sidebar') ) and if ( function_exists('dynamic_sidebar') ) unnecessary? They were both introducted in 2.2.0 which was released in 2007.

  2. Nice technique, it’s useful to infinitely upgrade the page adding more widgets. The 404 page I’m using on my site ilovecolors includes a search field which is automatically populated with the last permalink section, the one referring to the page requested and not found. For instance, if you go to:

    http://www.ilovecolors.com.ar/wpcandy-404-article

    will parse the url and enter “wpcandy 404 article” to the search field. The page also features the latest posts, links to go back to home page and suggestions to browse the site.

  3. Great advice Ryan 404 pages are very important to get right, you never want the user to lose trust in your site with a poor 404 that may direct them away from your site. Always give the user options to browse elsewhere around your site.

Leave a Reply

Please note that WPCandy is a moderated community.

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>