A Useful Error 404 Page for WordPress

No matter how meticulous you are, error 404s (page not found) will occur with almost every web site. This is a simple method for producing a more useful error 404 page for your WordPress blog.

An error 404 occurs whenever a page or other web resource is requested and that item is not found. Error 404s result from pages that are removed, a change in a URL structure for a site, and also from hack attempts. Hack attempts are so common that if you view the error 404 log for almost any web site, you are likely to see page requests for hundreds of pages that never existed in your site. This is caused by probing on the part of hackers to see if they can determine the platform that a site is built on.

There is not much that we can do to stop hack attempts. That is a security issue. The the focus of this WordPress tutorial is to produce a more useful error 404 page for legitimate users. Every web site should have an error 404 page so that if a user finds an obsolete link in a search engine or somewhere else on the web, they are not shown the standard generic and mostly blank page that a browser generates that might lead a user to believe that the site is down. WordPress does have a built-in error 404 page that is found in almost every theme. The default page is commonly pretty plain and simply allows a user to search for whatever they may be looking for. We are going to spruce that up a bit.

We started with the default error 404 page found in the Twenty Ten theme that comes with the 3.0.0 and newer versions of WordPress. The file is named 404.php.

We see two problems with this very plain version of a web page. While it does display most of the elements of the theme, it lacks a sidebar, which can be a very useful tool to help users find what they are looking for. We are therefore going to add a call to the theme’s sidebar.

We have also added a call to a WordPress function that displays the last 10 posts that were made. If you have an active blog, this can help drive users to your most current blog posts.

You can use the following code to replace the current 404.php found in the Twenty Ten and most other WordPress themes.

<?php
/**
 * The template for displaying 404 pages (Not Found).
 *
 * @package WordPress
 * @subpackage Twenty_Ten
 * @since Twenty Ten 1.0
 */

get_header(); ?>

<div id="container">
<div id="content" role="main">

<div id="post-0" class="post error404 not-found">
<h1 class="entry-title"><?php _e( 'Not Found', 'twentyten' ); ?></h1>
<div class="entry-content">
<p><?php _e( 'Apologies, but the page you requested could not be found. Perhaps searching will help, or browse our most current articles.', 'twentyten' ); ?></p>

<div style="margin-top:25px"> 
<h2>Most Recent Articles</h2>
<ul>
<?php wp_get_archives('type=postbypost&limit=10'); ?>
</ul>
</div>

<?php get_search_form(); ?>
</div><!-- .entry-content -->
</div><!-- #post-0 -->

</div><!-- #content -->
</div><!-- #container -->
<script type="text/javascript">
// focus on search field after it has loaded
document.getElementById('s') && document.getElementById('s').focus();
</script>

<?php get_sidebar(); ?>
<?php get_footer(); ?>

We have added the code found on lines 20 through 25 and on line 38. wp_get_archives is a built-in WordPress function that will retrieve however many of the most current posts that you wish to display. You can change the number of posts displayed by altering the value assigned to the ‘limit’ parameter. Displaying 5 to 10 of the latest posts is typically sufficient.