Difference between revisions of "Apache 2 - Custom error page"

(Created page with "Edit your virtual host configuration: vim /etc/apache2/site-enabled/smartcards.conf Add: ## ERROR directory Alias /errors /var/www/errors <Locatio...")
 
 
(7 intermediate revisions by the same user not shown)
Line 1: Line 1:
 +
[[Category:Linux]]
 +
 +
=Update Apache2=
 +
 
Edit your virtual host configuration:
 
Edit your virtual host configuration:
 +
 +
<syntaxhighlight lang="bash">
 
vim /etc/apache2/site-enabled/smartcards.conf
 
vim /etc/apache2/site-enabled/smartcards.conf
 +
</syntaxhighlight>
 +
  
 
Add:
 
Add:
 +
 +
<syntaxhighlight lang="bash">
 
         ## ERROR directory
 
         ## ERROR directory
 
         Alias  /errors  /var/www/errors
 
         Alias  /errors  /var/www/errors
Line 12: Line 22:
 
         </Location>
 
         </Location>
  
         ErrorDocument 403 /errors/error403.html
+
        # 403 access forbidden
 +
         ErrorDocument 403 /errors/error_403.html
 +
        # 404 page not found
 +
        ErrorDocument 404 /errors/error_404.html
 +
        # 500 internal error
 +
        ErrorDocument 500 /errors/error_500.html
 +
</syntaxhighlight>
 +
 
 +
 
 +
Restart web server
 +
 
 +
<syntaxhighlight lang="bash">
 +
service apache2 restart
 +
</syntaxhighlight>
 +
 
 +
 
  
Create the error page
+
=Create the error page=
 +
 
 +
 
 +
<syntaxhighlight lang="bash">
 
mkdir -p /var/www/errors
 
mkdir -p /var/www/errors
cp <monImage> /var/www/errors/error403.png
+
cp <monImage> /var/www/errors/error_403.png
vim /var/www/errors/error403.html
+
vim /var/www/errors/error_403.html
 +
</syntaxhighlight>
 +
 
 +
 
 +
Put the following content
 +
 
 +
<syntaxhighlight lang="html5">
 +
<html>
 +
<head>
 +
<title>403 - Forbidden</title>
 +
<style type="text/css">
 +
.content {
 +
width:880px;
 +
margin: 0 auto;
 +
}
 +
.wrapper {
 +
display:block;
 +
overflow: auto;
 +
}
 +
.errorText {
 +
color: #D63301;
 +
//background-color: #FFCCBA;
 +
font-size: 1.25em;
 +
}
 +
</style>
 +
 
 +
 +
</head>
 +
 
 +
<body>
 +
<div class="wrapper">
 +
<div class="content">
 +
<img src="./error_403.png" alt="Error 403" />
 +
                                <br/>
 +
                                <span class="errorText">This website is restricted</span><br/>
 +
</div>
 +
</div>
 +
</body>
 +
</html>
 +
</syntaxhighlight>
 +
 
 +
!! Don't forget to adjust the path in <img ... />
 +
 
 +
 
 +
==Set rights==
 +
 
 +
<syntaxhighlight lang="bash">
 +
chown -R www-data:www-data /var/www/errors
 +
chmod -R 755 /var/www/errors
 +
</syntaxhighlight>
 +
 
 +
 
 +
 
 +
=Images=
 +
 
 +
You can download some images in the following archive: [http://daxiongmao.eu/wiki_upload_files/apache2/errors.zip errors.zip]
 +
 
 +
 
 +
Or below:
 +
 
 +
 
 +
==403 access forbidden==
 +
 
 +
[[File:Error_403.png|none|Error 403]]
 +
 
 +
 
 +
==404 page not found==
 +
 
 +
[[File:Error 404.png|none|Error 404]]
 +
 
 +
 
 +
==500 internal error==
 +
 
 +
[[File:Error 500.png|none|Error 500]]

Latest revision as of 20:00, 19 September 2014


Update Apache2

Edit your virtual host configuration:

vim /etc/apache2/site-enabled/smartcards.conf


Add:

        ## ERROR directory
        Alias   /errors   /var/www/errors
        <Location /errors >
                #Require all granted
                ProxyPass !
                order deny,allow
                allow from all
        </Location>

        # 403 access forbidden
        ErrorDocument 403 /errors/error_403.html
        # 404 page not found
        ErrorDocument 404 /errors/error_404.html
        # 500 internal error
        ErrorDocument 500 /errors/error_500.html


Restart web server

service apache2 restart


Create the error page

mkdir -p /var/www/errors
cp <monImage> /var/www/errors/error_403.png
vim /var/www/errors/error_403.html


Put the following content

<html>
	<head>
		<title>403 - Forbidden</title>
		<style type="text/css">		
			.content { 
				width:880px;
				margin: 0 auto;
			}
			.wrapper { 
				display:block; 
				overflow: auto;
			}
			.errorText {
				color: #D63301;
				//background-color: #FFCCBA;
				font-size: 1.25em;
			}
		</style>

		
	</head>

	<body>
		<div class="wrapper">
			<div class="content">
				<img src="./error_403.png" alt="Error 403" />
                                <br/>
                                <span class="errorText">This website is restricted</span><br/>
			</div>
		</div>
	</body>
</html>

!! Don't forget to adjust the path in <img ... />


Set rights

chown -R www-data:www-data /var/www/errors
chmod -R 755 /var/www/errors


Images

You can download some images in the following archive: errors.zip


Or below:


403 access forbidden

Error 403


404 page not found

Error 404


500 internal error

Error 500