How to customize your WordPress Blog’s 404 page

If you got a WordPress Blog, this one is for you.

What is a 404 page?

Many times it may happen that a visitor lands on a page that doesn’t exist, and so a 404 error is returned by the server which displays a custom page. This page is referred as a 404 page. To have a look at your 404 page, just type anything following the url of your site. E.g. www.domainname.com/jdjshb/ To check my 404 page just go to this URL http://blog.ashfame.com/ashfameissexy

What is the need for customizing 404 page?

If a potential visitor lands on a 404 page, he is likely to bounce off. However, you can make your 404 page much more informative, and provide your visitors with a way to navigate through your blog. I am sure if one wants to grow, he can’t afford to loose traffic in any case.

How to Customize the 404 page?

First of all, make sure your theme has a 404.php file under the theme’s directory. If it doesn’t exist then you can manually upload it via FTP. From the Admin Dashboard, Select Presentation > Theme Editor > 404.php You can add anything that give visitors a option to browse your blog. The things you offer depend totally on you. You can offer them an option to search your blog or let them browse through the categories or whatever you want. Here are some codes you can add in your 404.php to make 404 page worthy.

Search Feature

<form method=”get” id=”searchform” action=”<?php bloginfo(‘url’); ?>/”>
<div><input type=”text” value=”<?php the_search_query(); ?>” name=”s” id=”s” />
<input type=”submit” id=”searchsubmit” value=”Search” />
</div>
</form>

Archives By Month

<h2>Archives by Month:</h2>
<ul>
<?php wp_get_archives(‘type=monthly’); ?>
</ul>

Archives by Category

<h2>Archives by Subject:</h2>
<ul>
<?php wp_list_cats(); ?>
</ul>

Bonus tips:

• You can show off weekly archives by replacing monthly by weekly. E.g. <?php wp_get_archives(‘type=weekly’); ?>
• Just wrap the code with <div id=”left”> Place Code here </div> to align it to left.
• Just wrap the code with <div id=”right”> Place Code here </div> to align it to right.
• You can even use 404 page to promote some of your best articles.

If you like the tutorial, then please take out some time to share it on social networking sites by using the icons below. Things like these will encourage me to come up with more of such tutorials.