This article assumes you are using an Apache server.
Introduction
The standard 404 (not found) message is ugly plain text . You are more likely to keep people on your site by using a custom 404 page that links to your site’s content.
Fig 1: Custom 404 Not Found Page
Fig 2: Custom 403 (Forbidden) page
The standard 403 (forbidden) message is also plain text.
Fig 2: You may want to provide a link to your home page just in case genuine visitors are 403’d.
If you are not concerned about bandwidth or processing load; you may wish to do something fancy like displaying IP addresses and some server-side processing/logging.
Note: IE 9(?) appears to ignore custom 403 error messages and continues to display its own standard “HTTP 403 Forbidden” page.
Custom pages do not have to be plain (s)html files. The 404 page above was generated by a PHP file; and the 403 “page” was created by modifying the server’s default 403 message (a single line edit to your htaccess or.conf).
The usual disclaimer: the suggestions and examples in this article work for me; but I can’t guarantee they will work, or be safe for use on your site. You use the ideas and content of this page at your own risk.
Custom files and custom security – pitfalls
Your custom error page files are subject to the same access security rules as other pages on your site. This can lead to “infinite” loops.
For example: If .htaccess blocks the visitor’s IP address then the server will try to serve your custom 403 page, but it will also be blocked by the same access rule. This will cause another 403 deny, and another blocked attempt to serve the custom 403 page etc. etc. This is a potentially infinite loop – but hopefully you or your host has configured the server to “LimitInternalRecursion”.
You can edit htaccess to always allow your custom page e.g. 403.shtml:
<Files 403.shtml> order allow,deny allow from all </Files>I became aware of this problem after reading posts on forums like Webmasterworld. JdMorgan’s second post in this thread suggests another way of ensuring your custom page(s) are allowed as well as info on the order in which allows and denies are processed.
The title says 4 ways to create custom 403 and 404’s – okay what are they?
1. Use ErrorDocument to change the default message(s):
The simplest solution. It is also the most efficient; your server does not have to retrieve and parse another file. As a bonus, you don’t have to worry about the infinite loop problem (above).
It is more efficient to change the default message(s) in httpd.conf; but you can add the same ErrorDocument to .htaccess. Example; to produce the page in Fig 2:
ErrorDocument 403 "Sorry the link you used is invalid.<br /><h2>Please visit our <a href='/'>Home Page</a></h2>"
I’ve tested this on my version of Apache; and confirmed the message string can contain HTML tags – so you should be able to include hot links like the above.
This is great for custom 403 messages where you don’t want to waste your bandwith sending 20kb of formatted page to visitors who will usually be hackers. However, if you want to present a friendly 404 page with the look and style of your site you will have to provide a file of HTML.
2. Setting up custom pages via your control panel:
Cpanel (and others) provide simple editors to create custom error pages, and the editors may provide add functions to include the visitor IP address, referring URL etc in your code.
Cpanel saves the code in your web root directory as .shtml; prefixed by the relevant Status (error) Code e.g. 404.shtml.
3. By adding your own 404.shtml (or 403.shtml) file to the web root directory.
And see if it works. I think most Apache servers look for nnn.shtml files, and if present use these instead of the default message.
ErrorDocument 404 /my-error-pages/my404notFoundPage.php
The error “redirect” does not even have to be on the same domain:
ErrorDocument 403 http://example.com/blacklist/badip-logger.php
70 Custom 404 pages to inspire you
Listed and showcased by 1stwebdesigner.com.
My favourite: orangecoat.com.
Please Comment
Genuine comments, critiques, and suggestions are always welcome.
If you thought this article useful or interesting then a Like or “+1” at the top of the page would be really appreciated.
Related articles
Thanks for this post, ive been searching for hours to fix the redirect loop.
Ive tried all but it seems method number 4 works for me.
Ive bookmarked your website and thanks again.
Great to hear the article was useful.
You didn’t include your website URL with your post . If this was a mistake let me know via the email address you provided with your original comment and i’ll insert it.
It seems odd to get a genuine post without a website address; but a nice change to the usual bland and meaningless spam comments (not published) that include loads of links.
I generally build error pages for html sites but this is the first I put together for a WordPress site. Take a look at my .htaccess file for instance http://marine.the-justgroup.com/.htaccess
Hi Chip. Nice! Like you I usually use custom 403 pages on my own “HTML” sites. For WP sites I use the default “unfriendly” 403 status. I may now add one to my WP sites but will have to assess whether I want to waste the bandwidth on what will mainly be hackers.
Thank you for explaining clearly and showing examples for great 404 pages.
http://www.scissorcraft.com/missing.html
Nice 404 page, in keeping with the site.
Last Option worked for me perfectly
I added it like this
ErrorDocument 403 /MyErrorPag.html
Hey! Just a quick thank you for that easy fix for my 403 page. I had a spammer constantly commenting and even though spammers don’t deserve it, I wanted my OWN message to pop up on my 403 page. With just that simple code ErrorDocument 403 “Beat it! You are not welcome here!!” I’m not bothering with any special html file or anything else.
Shout out to ya! I forgot how easy it was to do and found your article right in a nick of time. No more spam! Wish I could have seen their faces when they got the report that their bots failed this time!!