24/7 HUMAN WORDPRESS WATCH · SAN DIEGO, CA · SINCE 1998
HackGuard.com Managed WordPress Security with Heart
TOPIC CLUSTER · ERROR RESCUE & RECOVERY

WordPress 404 Page Setup in Five Minutes: Stop Losing Visitors to Broken Links

Jim Walker By Jim Walker, The Hack Repair Guy™ Updated Topic: WordPress Troubleshooting & Error Rescue
Quick Answer

A custom 404 page keeps visitors who click old or mistyped links on your site by giving them a search bar, links to your main services and articles, and your contact information instead of a dead-end error.

WordPress 404 Page Setup in Five Minutes: Stop Losing Visitors to Broken Links
How to customize your WordPress 404 error page so visitors and search crawlers find your main pages instead of leaving.

Why this matters for your WordPress site

Most WordPress themes include a 404.php file.

If your does not it's likely that adding a custom 404.php file will simply work out-of-the-box.

Below is my recommended coding for your 404.php file.

First, duplicate your index.php file, then rename as: 404.php

Step-by-step setup and recommendations

Note where the body text section is located within the file and simply replace with this example below. Change the descriptive text and styling as needed:

<div id="content" class="narrowcolumn">
<h2>My_Domain<br />Our goal is to help...</h2>
<p>Call us anytime, yada yada</p><br />
<?php
$s = preg_replace("/(.*)-(html|htm|php|asp|aspx)$/","$1",$wp_query->query_vars['name']);
$posts = query_posts('post_type=any&name='.$s);
$s = str_replace("-"," ",$s);
if (count($posts) == 0) {
$posts = query_posts('post_type=any&s='.$s);
}
if (count($posts) > 0) {
echo "<ol><li>";
echo "<p>Were you looking for one of the following articles?</p>";
echo "<ul>";
foreach ($posts as $post) {
echo '<li><a href="'.get_permalink($post->ID).'">'.$post->post_title.'</a></li>';
}
echo "</ul>";
echo "<p></p></li>";
} else {
echo "<p></p>";
echo "<ol>";
}
?>
<li>
<label for="s"><strong>Search</strong> for it:</label>
<form style="display:inline;" action="<?php bloginfo('siteurl');?>">
<input type="text" value="<?php echo esc_attr($s); ?>" id="s" name="s"/> <input type="submit" value="Search"/>
</form>
</li>
</ol>
</div>

Common mistakes to avoid

Note: this example uses query_posts(), which WordPress now discourages in modern themes. It still works on most sites, but test your 404 page after adding it by visiting a made-up address on your site (see the test URL below).

Then test your 404 page by going to http://your+domain/junktext

Suffice it to say, having a poorly coded or broken 404 page can cause a great deal of hurt SEO-wise if you don't do this right...

Enjoy!

Frequently asked questions

What is the fastest way to fix or prevent this issue on my WordPress site?
A custom 404 page keeps visitors who click old or mistyped links on your site by giving them a search bar, links to your main services and articles, and your contact information instead of a dead-end error.
Can HackGuard.com handle troubleshooting & php for my WordPress site?
Yes. For $14.95/month (or $49.85/month for up to 10 sites), Jim Walker and the HackGuard team perform a 9-point manual security and database overhaul in Week 1, test all core and plugin updates weekly by hand, maintain 60-day offsite cloud backups, and back your site with a free HackRepair.com cleanup guarantee. Call Jim directly at (619) 479-6637.
Jim Walker, The Hack Repair Guy

Written and reviewed by Jim Walker, The Hack Repair Guy™

Jim Walker has protected and repaired WordPress websites since 1998. Want Jim to handle your WordPress security, weekly updates, and 60-day offsite cloud backups for 50 cents a day?

Client Video Story