Tutorial: Custom ‘404’ Error Page

Tutorial: Custom â404â error page

 

This tutorial will attempt to describe the method of your own 404 error page.

 

The requirements for this tutorial are:

 

⢠A basic knowledge of HTML.

⢠A Basic knowledge of Headers.

⢠A basic knowledge of PHP.

⢠A server running PHP and Apache.

 

Xisto fills the last requirement, the rest are up to you!

 

 

The â404â error

 

A â404â error is an error which appears to give the user a message; it means that there has been a client side error in a page request. This should indicate one of two things to the user, either they have entered an incorrect URL or they have followed a broken link.

 

The user at this point will probably be presented with the ugly site of a Microsoft page telling them the page cannot be found (see http://forums.xisto.com/no_longer_exists/ to see what I mean). The response may be that the user, due to possibly there own fault, will now leave your site. A custom 404 error page will therefore hopefully keep them on your site long enough to sell your product, give them the information, or whatever you are trying to do on your site.

 

Writing an informative â404â error page

 

The most important thing that is needed is to describe the error to the user and offer a solution to the problem, for instance linking back to your homepage or another area of the site that will provide search functions. Or even providing search functions on the â404â error page (this is beyond the scope of this tutorial so you will have to do that yourself)

 

Creating a page that uses your sites colour scheme is good, CSS provides this, so simply attaching a CSS file to your HTML document will allow the user to see they are still on your site.

 

I always like to inform the user of the address that the requested. This is very easy to do with a combination of PHP and exploiting the browsers headers.

 

A header is information that is sent to the server that requests a page; this can be retrieved by the server side language PHP by adding the following code onto your page.

 

<?php$address = getenv ("SERVER_NAME") . getenv ("REQUEST_URI");$message = "<p align=\"center\">Server cannot find " . $address . "</font></p>";echo $message;?>

This will read the header and display the address of the site the user requested on the â404â page. Other formatting issues are mostly up to you; just remember that being helpful is always the best course of action.

 

Save the file once the design is completed as something like 404error.php (remember the extension must be .php otherwise your scripting will not work!).

 

An important thing to mention is that IE 5 and IE 6 will only respond to error pages that are greater than 512 bytes in size. An easy was to get around this if yours isnât is to fill it with HTML comments to increase the size of the page. If a â404â error page is less than 512 bytes then IE displays the default Microsoft one.

 

Setting up Apache

 

This part of setting up the custom â404â error part is quite easy, it requires the creation (if one does not already exist) of a .htaccess. If on a windows machine ensure that this file has the extension changed, and not left as .htaccess.txt.

 

If this file already exists then it just requires modifying to include the following line:

 

ErrorDocument 404 PATH

Where âPATHâ is the path of your error file, e.g. /error/404.php. No quotes are required around this path or anything however remember that you need the initial forward slash, â/â.

 

If the .htaccess file does not exist then you only need add this line to one and save it.

 

Upload it to the root of your web directory usually public_HTML and ensure that the CHMOD is correct so as people cannot edit this file. This should be 644.

 

Conclusion

 

I hope that explains the ideas behind creating a simple â404â error page, there are many other things that you can do to extend this but this will allow you to create something that will hopefully keep people on your site.

 

Thatâs the end of this tutorial so good luck and have fun web-designing.

But this only works if your host lets you upload .htaccess files. Many free sites restrict you from this upload. [Does Xisto let you?] Using the .htaccess file is the only way, right?

yes with a server running apache, the only way to use a custom '404' error page is with the .htaccess file. Xisto does let you do this (at least i have done it and no one has complained to me ). logging in with your FTP client and entering the /public_html directory should display a .htaccess file there for you.

Good tutorial (Y)Very usefull for webdesigners...

Thanks for the tutorial man!!!!This is something I always wanted to know and do!!!

You can always use the Custom Error Pages on the Xisto Control Panel.