Welcome to Custom 404 Error Page! This site offers you information on how to create your own 404 error pages, some cool content you can add, and even how you can add links to other sites that aren't what they appear.

tutorial how to add a search / Google to custom 404 error page, error 404 page

Adding a Search Box to Your Custom 404 Error Page
Directions for Webmasters of any level

Hopefully you've played around with some HTML when you were building your custom 404 error page, as explained in our tutorial on creating your custom 404 error page, in which case this will be a breeze.

If not, it's time to roll up your sleeves and get ready to do some coding!

Step One: Identifying your 404 error page

The first step is to figure out which page is your custom 404 error page.

Most likely you've just built it, so that's a very simple step, but if not, identify your httpd.conf file, then find the line therein that looks like this:

ErrorDocument 404 /errordoc-404.shtml
That'll tell you what file is your 404 error page.

Step Two: Open up the file for editing

There are dozens of different Web page and HTML editors on the market, so your process will likely be different to what we use, but hopefully you have a tool like Homesite, BBEdit, or even vi or EMACS to edit the file and can do so directly. If not, you might need to download the HTML file from your server to your local computer then open it with a simple editor like NotePad (on Windows) or TextEdit (on the Macintosh) to proceed.

Step Three: Copy and paste this code

Now the fun part: copy the following lines of HTML and paste them directly into your custom 404 error page:

  method="get" style="margin-left: 2em;" />
 
 
  intuitive.com" />
 
      style="font-size:75%;" />
You need to change the domain name from intuitive.com to your own domain, but that's the only customization required.

Save the changes and upload the new version of the file if needed.

NOTE: if you look at that code and say "what kind of wierd HTML style is that, dude?" then you haven't seen XHTML before, and you might well want to consider buying a copy of the excellent book Creating Cool Web Sites. In a word, XHTML is the future and it's never too soon to move in that direction.

Step Four: Testing

Once you've saved your new custom 404 error page, generate a page by hitting a link like http://www.intuitive.com/badpage and looking for the form. It should be there, and it should look like this:

That's all there is to it. You now have a lovely Google search engine that constraints itself automatically to a search of your pages only. Now you should ensure that and you might also want to fix spelling problems too. :-)