When someone visit a page in your website and if the page is not found or the page is forbidden and or the webpage encountered internal server error than a default server webpage will be display which is
not customisable and visually beautiful.
So, in this tutorial we will show you how to create custom error page using PHP.
To Create Custom Error Page It Takes Only Two Steps:-
- Create or modify .htaccess file and write redirect method
- Make a HTML file and define markup and styling
Step 1. Create or modify .htaccess file and write redirect method
#Rewrite URL's RewriteEngine On RewriteRule ^error/?$ errors/error.html [NC] # Enable Error Documents # (404,File Not Found) | (403,Forbidden) | (500,Internal Server Error) ErrorDocument 404 /error ErrorDocument 403 /error
In this step we create a .htaccess file in server main directory and write some rules for error page.
We turn the rewrite engine on so we can redirect url to our custom error page then we define rules for 404 (File Not Found), 403 (Forbidden) and 500 (Internal Server Error) webpage to redirect when any of these error occur to 'error.html' page which we were going to create in next step.
Step 2. Make a HTML file and define markup and styling
We make a HTML file and save it with a name error.html
<html> <head> <style> body { margin:0 auto; padding:0px; text-align:center; width:100%; font-family: "Myriad Pro","Helvetica Neue",Helvetica,Arial,Sans-Serif; background-color:#01A9DB; } #wrapper { margin:0 auto; padding:0px; text-align:center; width:995px; } #wrapper h1 { margin-top:50px; font-size:65px; } #wrapper a { color:blue; font-size:20px; } </style> </head> <body> <div id="wrapper"> <h1>Soory For The Inconvenience Please Try Again Later</h1> <a href="http://talkerscode.com">TalkersCode.com</a> </div> </body> </html>
In this step we create a simple page which is displayed on any of these errors written above.
That's all, this is how to create custom error page using PHP. You can customize this code further as per your requirement. And please feel free to give comments on this tutorial.
Latest Tutorials
- Create Animated Skill Bar Using jQuery, HTML And CSS
- Simple And Best Responsive Web Design Using CSS Part 2
- Show Button On Hover Using HTML And CSS
- Material Design Login Form Using jQuery And CSS
- Animated Progress Bar Using jQuery And CSS
- Dynamic Drop Down Menu Using jQuery, Ajax, PHP And MySQL
- Get Website Statistics Using PHP, jQuery And MySQL
- HTML5 Login And Signup Form With Animation Using jQuery
- Facebook Style Homepage Design Using HTML And CSS
- View Webpage In Fullscreen Using jQuery