Hello and welcome to the Webmasters Forums!. This is the best place to get webmasters resources for free. Get $2 for free today, read more - Make your payment today. Download premium and professional templates for free. Get free web hosting without ads, read more. You can get lot more by simply join with this forum. To gain full access to the forums you must sign up for a free account.


Post Reply  Post Thread 

Tutorial on making a custom 404 error page

Post Bank
Posting Manager
******

Posts: 995
Group: Forum Team
Joined: Sep 2006
Status: Online
Make money from now. You can make money just for posting on this forum. Every discussions on this community gives you more money. $2 minimum payout. So get your payment today, SignIn with this forum.

Signin to Remove this Post

Dhanraj
Senior Member
****


Posts: 272
Group: Registered
Joined: Aug 2007
Status: Offline
Reputation: 1
Points: 99 (Donate)
Post: #1

Tutorial on making a custom 404 error page


Here is a tutorial on making a custom 404 error page

Quote:
How to Set Up A Custom 404 File Not Found Page
by Christopher Heng, thesitewizard.com

Let's do a quick survey: what do you usually do when you click a URL and encounter a "404 File Not Found" error? Do you:

Click on the BACK button of your browser and go somewhere else?
Try to back up one directory in the URL and try again?
Write to the webmaster of the site and the referring site to inform them of the situation?
If you are like most people, you'll simply click on the BACK button and try another place. The majority of people don't even know that there are any other alternatives.

You thus need to do something so that you do not lose this group of people who come to your site by following an old link or by typing your URL incorrectly.

Requirements for Customizing the 404 File Not Found Page
It is not possible to customize your 404 error page if your web host has not enabled this facility for your website. For example, at the time of this writing, if you host at Geocities or Tripod, you would not be able to customize your 404 Error Page.

If your web host has this facility, you will usually find mention of this somewhere in their documentation. In fact, if they mention somewhere that you can customize a file named ".htaccess", it probably means that you can also customize your 404 File Not Found error page.

The .htaccess file is what Apache web servers use to allow you to fine-tune your web server configurations at a directory level. Other types of web servers handle the customization of 404 error pages differently.

Step One: Creating/Modifying the .htaccess File
This step may not be necessary in all situations. Some web hosts already configure their web server so that it will look for a specific file in your web directory when a certain document cannot be found. If so, simply skip this step.

If your web server is not an Apache web server, you will have to find out from your web host what you need to do to enable the server to serve your customized file when a file cannot be found.

Otherwise, the first thing you need to do is to add the following line to a file named ".htaccess" (without the enclosing quotes and with the preceding period). In most instances, no such file will exist, and you can simply create one with a text editor (such as Notepad on Windows).

ErrorDocument 404 /notfound.html
You will of course need to put a notfound.html file in the main web directory for the above directive to work.

The "ErrorDocument 404" directive essentially tells the Apache web server that whenever it cannot find the file it needs in that directory and its subdirectories, it is to use the document specified in the URL that follows.

One .htaccess file in your main directory will do the trick for that directory and its subdirectories. However, if you want a certain subdirectory to show a different 404 File Not Found message, you can always place a .htaccess file into that directory. This will override any .htaccess files you have in the parent directories.

Step Two: Creating Your Error Document File
What should go into your custom 404 File Not Found page?

It is insufficient to simply let the visitor know that the file could not be found. In order not to lose that visitor, you will have to provide him some way to locate the document he wanted, or you would have lost him.

Your page should have one or more of the following things:

A link to your main page, with a suggestion that the visitor can find what he wants there.
If you have a search engine for your website, you should definitely put a search box on that page. Many people prefer to simply type a query than to scan through your site map.
A link to your site map, which lists all the pages on your website.
If you know of frequently mistyped URLs on your site, you can even put links to the correct location directly on the page, so that visitors who arrive there from outside can quickly get to the correct page. Remember, you don't want to lose that visitor, so do all you can to help him.
Any other navigational aids that you may have - for example, if you have a drop down navigation menu on your normal pages, you should probably put one here as well.
If you like, you can even put a simple form on the page to allow your visitors to inform you of the broken link. However, the primary aim of this page is not to help you track bad links, but to make sure your visitor does not leave your site if what he wants can be found there.

Incidentally, you should make your 404 page larger than 512 bytes, even when you are testing. Otherwise Internet Explorer (IE) will load what it calls its built-in "friendly HTTP error message" instead of your 404 page.

Step Three: Testing the Error Document
When you're satisfied with your page, upload it together with your .htaccess file to your website. Then test it by typing a URL that you know does not exist.

Your error page should load up. From this error page, test to see that the links here lead to the pages you intended it to lead.

Common Errors with a 404 Custom Error Page
The most common error people have with their custom error page is making a mistake in the URL they put in their .htaccess file. This leads the web server into a loop when a visitor tries to access a missing file. When a file cannot be found the server tries to load the file specified in your ErrorDocument directive. But that file does not exist too, so it tries to load the file specified in that directive. You get the idea.

Make sure you test your error file by typing in a non-existent URL. Do not test it by typing its real URL - that will of course work but it will prove nothing.

Another common error is to forget that your 404 Error Page may be loaded either from the main directory or from a subdirectory or even your CGI-BIN directory. When you put links on your 404 Document Not Found page, such as hyperlinks leading to other pages on your site or links to images (such as your logo), be sure that you use the full URL and not a relative link. That is, use things like

<a href="http://www.your-domain-name.com/sitemap.html">Site Map</a>
instead of

<a href="sitemap.html">Site Map</a>
The first will work even if the 404 page appears for a missing file in a subdirectory, but the second will not.

Conclusion
When a visitor encounters a 404 File Not Found error on your site, you're on the verge of losing the visitor that you've worked so hard to obtain through the search engines and third party links. Creating your custom 404 error page allows you to minimize the no of visitors that way

source origin http://thesitewizard.com/archive/custom404.shtml


Free cash for surveys

Our Great indian forum

Pretty good PTC-Real

Anonymize your links
11-09-2007 03:58 PM
Visit this user's website Find all posts by this user Quote this message in a reply
ivenms
Administrator
*******


Posts: 2,179
Group: Administrators
Joined: Sep 2006
Status: Offline
Reputation: 14
Points: 4389 (Donate)
Post: #2

RE: Tutorial on making a custom 404 error page


Good tutorial. Hope that this will help others...

But there is some problem if you are trying to implement this technique on your server.

Many of the server not allows permission to make custom error pages with .htaccess files. On those cases, the result will be a 500 Error page: "Internal Server Error" after editing the htaccess files.

Just notice my points on the time of making your custom error pages.


Read: General Rules & Policies before posting.
Make Money By Posting | Earning and Exchanging Points | Add Your Links
11-09-2007 06:19 PM
Find all posts by this user Quote this message in a reply
Dhanraj
Senior Member
****


Posts: 272
Group: Registered
Joined: Aug 2007
Status: Offline
Reputation: 1
Points: 99 (Donate)
Post: #3

RE: Tutorial on making a custom 404 error page


thank you ivenms i got this problem many times.i have some free web hosters who allow .htaccess but the bandwidth and space are merely 200-300 mb which is insufficient.any way this tutorial is not mine.i just copy pasted from another site.ok if you are interested i will post more


Free cash for surveys

Our Great indian forum

Pretty good PTC-Real

Anonymize your links
11-09-2007 11:43 PM
Visit this user's website Find all posts by this user Quote this message in a reply
ivenms
Administrator
*******


Posts: 2,179
Group: Administrators
Joined: Sep 2006
Status: Offline
Reputation: 14
Points: 4389 (Donate)
Post: #4

RE: Tutorial on making a custom 404 error page


The tutorial is always helping others..

But before posting tutorials, carefully read the rules of this forum. You can post 5 to 6 articles per week without breaking any copyright laws.


Read: General Rules & Policies before posting.
Make Money By Posting | Earning and Exchanging Points | Add Your Links
11-09-2007 11:54 PM
Find all posts by this user Quote this message in a reply
Dhanraj
Senior Member
****


Posts: 272
Group: Registered
Joined: Aug 2007
Status: Offline
Reputation: 1
Points: 99 (Donate)
Post: #5

RE: Tutorial on making a custom 404 error page


ok iven bro i already read rules and regulations before started posting.currently i added just two of 6 and i already mentioned in my posts that it is not my contribution,but i am writing some articles now,and trying to distribute them as free e-books for promoting my site


Free cash for surveys

Our Great indian forum

Pretty good PTC-Real

Anonymize your links
14-09-2007 10:45 PM
Visit this user's website Find all posts by this user Quote this message in a reply
ivenms
Administrator
*******


Posts: 2,179
Group: Administrators
Joined: Sep 2006
Status: Offline
Reputation: 14
Points: 4389 (Donate)
Post: #6

RE: Tutorial on making a custom 404 error page


Dhanraj Wrote:
i am writing some articles now,and trying to distribute them as free e-books for promoting my site


That is a great Idea. You started a good promotional work. Those kind of promotions are always reliable. Because after several years, you can drive traffic through materials like that.

Other kind of promotional programs like advertising and search engine promotions are only short time promotions.

Good start. Keep it up.


Read: General Rules & Policies before posting.
Make Money By Posting | Earning and Exchanging Points | Add Your Links
15-09-2007 12:49 AM
Find all posts by this user Quote this message in a reply
walsh
Senior Member
****


Posts: 401
Group: Registered
Joined: Oct 2006
Status: Offline
Reputation: 0
Points: 680 (Donate)
Post: #7

RE: Tutorial on making a custom 404 error page


Custom 404 pages??

That is achievable for every hosting accounts, Smile Am I right??


05-10-2007 04:12 AM
Find all posts by this user Quote this message in a reply
godkillah
Senior Member
****


Posts: 261
Group: Registered
Joined: Sep 2007
Status: Offline
Reputation: 3
Points: 183 (Donate)
Post: #8

RE: Tutorial on making a custom 404 error page


Nice tut Smile
won't need it though because cPanel has a function to create custom error pages,
but if i ever get a hosting without it I'll sure give this a try Big Grin


05-10-2007 05:02 AM
Find all posts by this user Quote this message in a reply
walsh
Senior Member
****


Posts: 401
Group: Registered
Joined: Oct 2006
Status: Offline
Reputation: 0
Points: 680 (Donate)
Post: #9

RE: Tutorial on making a custom 404 error page


godkillah Wrote:
Nice tut Smile
won't need it though because cPanel has a function to create custom error pages,
but if i ever get a hosting without it I'll sure give this a try Big Grin


But that is only achievable for selected plan. My account not got those facility. So my question is that is it achievable for every hosts?


This post was last modified: 05-10-2007 05:16 AM by walsh.

05-10-2007 05:15 AM
Find all posts by this user Quote this message in a reply
godkillah
Senior Member
****


Posts: 261
Group: Registered
Joined: Sep 2007
Status: Offline
Reputation: 3
Points: 183 (Donate)
Post: #10

RE: Tutorial on making a custom 404 error page


walsh Wrote:
But that is only achievable for selected plan. My account not got those facility. So my question is that is it achievable for every hosts?


it was for all hosts i had


05-10-2007 02:46 PM
Find all posts by this user Quote this message in a reply
Dhanraj
Senior Member
****


Posts: 272
Group: Registered
Joined: Aug 2007
Status: Offline
Reputation: 1
Points: 99 (Donate)
Post: #11

RE: Tutorial on making a custom 404 error page


Quote:
That is achievable for every hosting accounts, Am I right??

You are right bro but most of ties we need a custom page,else the default server page'll arise but not our's


Free cash for surveys

Our Great indian forum

Pretty good PTC-Real

Anonymize your links
07-10-2007 07:03 PM
Visit this user's website Find all posts by this user Quote this message in a reply
ivenms
Administrator
*******


Posts: 2,179
Group: Administrators
Joined: Sep 2006
Status: Offline
Reputation: 14
Points: 4389 (Donate)
Post: #12

RE: Tutorial on making a custom 404 error page


godkillah Wrote:
it was for all hosts i had


But there are many hosts which not gives this facility. Some host just generate 404 headers and some host gives hosting site's advertisement page with 404 page label.


Read: General Rules & Policies before posting.
Make Money By Posting | Earning and Exchanging Points | Add Your Links
08-10-2007 03:19 AM
Find all posts by this user Quote this message in a reply
sridatta
Newbie


Posts: 5
Group: Registered
Joined: Oct 2007
Status: Offline
Reputation: 0
Points: 22 (Donate)
Post: #13

RE: Tutorial on making a custom 404 error page


Thanks for the awesome tut..

Quote:
<a href="http://www.your-domain-name.com/sitemap.html">Site Map</a>
instead of

<a href="sitemap.html">Site Map</a>
The first will work even if the 404 page appears for a missing file in a subdirectory, but the second will not.


suppose my site is http://www.sridatta.com. I create a error page error.html in www/sridatta.com/ directory (my home dir) and specify error.html in .htaccess page. My images folder is located in www/sridatta.com/images. So, i use relative paths to my error.html.

now, some visitor accesses a link http://www.sridatta.com/software/mytheme.exe file. Suppose the link is not available, then my error.html is displayed right.. Now, the image URLs are rendered relative to http://www.sridatta.com/software.. i.e. the URLs for images would turn out to be http://www.sridatta.com/software/images instead of http://www.sridatta.com/images which creates a problem displaying images...

Is my analysis right??

28-10-2007 01:46 PM
Find all posts by this user Quote this message in a reply
ivenms
Administrator
*******


Posts: 2,179
Group: Administrators
Joined: Sep 2006
Status: Offline
Reputation: 14
Points: 4389 (Donate)
Post: #14

RE: Tutorial on making a custom 404 error page


You can't use relative image paths on your error.html pages. Because when the user's requests on your sub directory generates 404 error and that time, your error page "error.html is generated on the sub directory. ie. Your error page shown on the browser as the same page the user requested. So the relative images are not displayed on the page.

In short:
User's Request: http://your-site.com/sub-directory/page.html - This generates 404 error.

But 404 error shown on the page: http://your-site.com/sub-directory/page.html (same as the requested page).

So the browser looks for images on the directory: http://your-site.com/sub-directory/images/

Only use full path to every images used on error.html page.


The quoted words suggest that relative links on server pages not gives the 404 custom error pages you made.


Read: General Rules & Policies before posting.
Make Money By Posting | Earning and Exchanging Points | Add Your Links
29-10-2007 03:04 AM
Find all posts by this user Quote this message in a reply
Post Reply  Post Thread 

Possibly Related Threads...
Thread: Author Replies: Views: Last Post
Sad PROMPT NAME ON START(javascript),IN A HTML PAGE. Plz help,its not working 4me! Lord_Daksh 8 317 22-09-2007 05:39 AM
Last Post: Lord_Daksh
  I would like to make a simple html page with a dynamic content using java script Cedik 10 389 11-09-2007 05:28 PM
Last Post: ivenms

View a Printable Version
Send this Thread to a Friend
Subscribe to this Thread | Add Thread to Favorites
Rate This Thread:

Forum Jump:

Sign In to Remove Ads

Download 1000's of web templates. Unlimited access!
World's Best Web Hosting
Website of the Month

Create-a-Page for Free
SOTM June 2008


Accepting Submissions
for July 2008
Resources

Recommended Sites:



Visit our Sponsors!

Current time: 13-10-2008, 10:07 PM


Copyright © 2002-2008 MyBB Group
Powered By MyBB