Aug
8
Have you customized your blogs 404 Error page? If you’re like me, you work hard to bring each and every visitor to your blog so don’t risk losing that visitor to a default 404 Error page because of a misspelled URL, broken link, or outdated search engine listing.
Most bloggers spend a lot of time tweaking and customizing the look and feel of their blog but ignore the importance of creating a custom error page. When a visitor lands on 404 Error page it can be frustrating and even intimidating for some. They know something happened but are not sure what caused the error or how to fix it and it is in your best interest to help them find what they are looking for. Of course, you hope that not many people will ever see your error page but you should be prepared just in case and luckily WordPress makes creating a custom 404 Error page easy.
As an example, I thought I’d show you the custom 404 Error page that I created for this site.
Basically, I created a normal page template and called it “404.php”. I then add some some static text to explain that there was an error and offer a few possible alternatives (homepage, archives, search). Finally, I use a WordPress Template Tag (wp_get_archives) to display links to the 10 most recent articles.
Below is the actual code I use on this site:
<div id="contentwrap">
<div class="entry">
<h2>404 - File Not Found!</h2>
<div class="entrybody">
<p>Sorry, the page you were looking for could not be found. It is probably not your fault… but if you think it is, please send an email to webmaster@pureblogging.com and let us know what you were looking for. We may be able to point you in the right direction.</p>
<p>You may also try one of the options below:</p>
<ul>
<li>You can search the site using the search box to the right.</li>
<li>You could visit <a href="http://www.pureblogging.com/">the homepage</a>.</li>
<li>Maybe what you are looking for is </a><a href="http://www.pureblogging.com/archives/">in the Archives</a>?</li>
<li>Or you could have a look through the recent articles listed below, maybe what you are looking for is there…</li>
</ul>
<strong>Recent Articles</strong>
<ul>
<?php wp_get_archives(‘type=postbypost&limit=10′); ?>
</ul>
</div> <!– [entrybody] –>
</div> <!– [entry] –>
</div> <!– [contentwrap] –>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
You could also add links to your pages, categories, popular posts, etc.
There may also be times when your web server encounters a problem before WordPress is aware of it. In that case, you can still guarantee that your web server sends the visitor to your 404.php template file by configuring your web server for custom 404 error handling. To do this you’ll need to edit the .htaccess file located in the main directory (where the main index.php file resides) of your WordPress installation.
Just add the following line to your .htaccess file:
That’s it… you can check out my 404 page here. If you’re looking for more inspiration, you might be able to find a few ideas at Area 404.
This is a great tip, I created my own when I started using my current theme, check out the Samanathon.com 404 page
I forgot to mention that I applied a separate AdSense channel for the 404 search so I could track it’s usage too!
D’oh! Good old Homer… that’s pretty good.
See, this is why you are an A-List blogger.
Very Nice David … thats one hell of a 404 Page!
Darin
Hi David,
This is something I haven’t done yet…you page looks great! You’ve inspired me to work on this now, thanks!
Good one!
Your 404 page looks cool
normally we reach their due to a typo while linking
so it sometimes happen that SE bots end up at that page.Its important to link that page well so that SE bot can go on.You have done exactly that
Also , forgot to mention
Am I the first person to… {TLA}?
I ‘m quite surprised no one else talked about it.
I have a basic 404 error page, but really need to work on sprucing it up a little. Thanks for the reminder by way of this article!
- Martin Reed
same here, my theme already has a 404 page, but I am going to edit it and try to add some suggestions to better guide visitors.
Too bad my hosting (godaddy) doesn’t allow true 404 page customization
//Sleeping Dude
[...] David Culpepper at Pureblogging.com has a step-by-step post explaining how to customize your 404 error pages. [...]
oh … i might need your help on this one …
Darin
It’s actually really easy to set this up, I’m sure we’d all be willing to help out!
[...] Here is link to this article: How to Customize Your Blogs 404 Error Page [...]
I like your 404 page! Do you add ErrorDocument 401 /index.php?error=401 to your .htaccess as well or just the 404? The query var error=404 gets removed if it is a status code 404, but remains if it is error=anything_else.
Check out what I mean with my 404 plugin.