A Nearly Perfect 404 Error Page in WordPress

2006 March 1
by Arun Bhai

In this seemingly infinite Web
Oh! young browser thou slips
In the middle of a thousand trips
Realising what was just
The apparent reality of pages
Is nothing but a veil of certainity
404 alone is the absolute reality
-Arun
So a visitor to your website mistypes a URL, what does he see? A nearly blank page with ‘404 error’ emblazoned over it? At least that was my case until I decided to do something about it.

So many great tutorials have been written on creating a 404 Error page. The best in my opinion is at SacramentoWeb. However, the solution the author has proposed leads the user to a search box already filled with a value by second guessing what the user tried to search for. I was looking for a 404 page that already has those results below the search box.

After some research, I finally hacked up some PHP code. The result can be already seen on my site and looks quite impressive. I mean I was quickly addicted to misusing the feature by performing random searches e.g. for hollywood stuff on my site I would try typing !!!

Here is a quick summary of what to do for any template to display these results:

  1. If you haven’t modified your .htaccess file, then open it and copy paste the following as your first line

ErrorDocument 404 /index.php?error=404

  1. Copy index.php from your template and rename it to 404.php in the same directory

  2. Remove all sections dealing with posts or comments. Roughly the lines between < ?php if ( have_posts() ) and “

  3. Copy the following line to the first line of 404.php. This is to help search engine spiders indicate that this is an error page.

header(”HTTP/1.0 404 Not Found”);

  1. You can write pretty much anything in this page. Or you can download my 404 page from here

  2. Thats it!

Check out the results, I’m sure you (and your visitors) would be able appreciate the improvements in the browsing experience.

Distantly Related posts:

  1. Wordpress Plugin: To show category Livemarks in Firefox
  2. Upgraded to Wordpress 2.0.5
  3. Is Python Intellisense Possible in Emacs?
  4. Forget Pages with Autopagerize
15 Responses leave one →
  1. April 26, 2006

    Just noticed your article, wanted to point out that when you say this:

    “I was looking for a 404 page that already has those results below the search box.”

    The article you linked to answers with this:

    “Why not automatically search, you ask? As much as I like that feature of Mike Davidson’s site, I am concerned with the cost this comes at. Do we really want to search the entire database (searching is expensive) on just about anything the visitor types in? I don’t.”

  2. April 26, 2006

    Thank you for this information, which I have used to put together my own wordpress 404 page. I just wanted to let you know, that instead of hardcoding the site URL (like you do in line 19 in the above code fragment), you can get the URL from wordpress like this: $search_url = get_bloginfo('url') . '/?s=';

    This template tag is documented in the codex: http://codex.wordpress.org/Template_Tags/get_bloginfo

    Regards

  3. April 26, 2006

    @justin:

    I understand the author’s concern on page loads. But I belive the behavior is as desired. So the user would not be dissappointed :D

    @chris:

    Thanks a lot! I have modified my code as per your suggestion. It looks more general purpose now :)

  4. June 14, 2006

    Hi Arin, thanks for this code, it works really well. Only thing is i had to delete line 20: $searchurl = getbloginfo(’url’) . ‘/?s=’; because i kept getting an error: Fatal error: Call to undefined function: getbloginfo() in /my/url/theme/404.php on line 20

    So my 404 page works without that line, but not if there is a long incorrect URL typed in, then it doesnt search for anything.

    Wonder if you could offer any help? Thanks again

  5. June 14, 2006

    sorry, one last thing, which i think might be the problem, how can i get the script to drop the / at the end of a url – because it doesnt search if there is a / attached to the end. The reason i am trying to fix this is because i changed my permalink structure, so all of my pages listed on yahoo search engine for example , point to my 404 page with a url ending in /, so im trying to get the script to find the pages. thanks again

  6. January 7, 2007

    Good article and should be pretty handy for all. Herez another simple trick to do it http://webtips.blogsome.com/2006/11/19/customize-404-page-free-blogs/

    But I am bit confused with this http://wordpress.org/support/topic/96927 Any thoughts?

  7. March 12, 2007

    Nice Site!!! (p)

  8. Mark permalink
    March 31, 2007

    Your demonstration link (…/blog/python) does not work (anymore?). It shows a simple, standard Wordpress (or maybe K2) 404 page. But I like your idea and will try on my blog.

  9. June 27, 2007

    Nice tip – I customized the 404 page to include archives and popular posts. What I wanted to do even further was to redirect people with a meta refresh. I recently changed my permalink structure and now people are looking for things that are not there.

    So when users go to OldARTICLElink, I want to redirect them to NewARTICLElink.

    My old permalink structure was category/post-title

    Now it’s date/category/post-title

    Any idea on how to do this?

  10. August 26, 2007

    What about other HTTP status codes? Like ErrorDocument 500 /index.php?error=500, etc… ? All 57 Status Codes

  11. November 3, 2007

    Awesome tip. I put it in and it works awesomely.

    I’m using Triple K2 and it works seamlessly.

Trackbacks and Pingbacks

  1. Tags at Is there food?
  2. metablog » 404 errors on blogs
  3. archGFX | Adding Search results to Wordpress 404 pages
  4. Mijn internet stream 2008-11-30 : Sander Tigelaar

Leave a Reply

Note: You can use basic XHTML in your comments. Your email address will never be published.

Subscribe to this comment feed via RSS

Additional comments powered by BackType