Penampakan dari pesan Error 404 Not Found pun terbilang standar. Itu-itu saja dan kurang menarik. Lalu bagaimana jika ingin mengubah dan mempercantik tanpilan pesan Error 404 Not Found? Apakah bisa dipercantik? Jawabannya adalah bisa! Mari kita simak.
Untuk melakukan modifikasi ini, syarat yang wajib dipenuhi adalah web server kita harus mengijinkan penggunakan .htaccess. Jika tidak, maka akan muncul pesan kesalahan Internal Server Error. Berkas .htaccess merupakan distributed configuration file yang berfungsi sebagai konfigurasi bagaimana web server kita diakses di dalam direktori tersebut. Selain itu juga dapat berfungsi sebagai autentikasi halaman, konfigurasi URL, dan lain sebagainya.
Jika syarat di atas dipenuhi, langkah selanjutnya adalah membuat berkas .htaccess. Di sini, kita memanfaatkan fungsi bawaan .htaccess yang akan me-redirect jika terjadi kesalahan. Berkas .htaccess tersebut harus diletakkan pada root directory dari web server. Nah, isi dari .htaccess adalah sebagai berikut:
ErrorDocument 404 /error.html
Dari berkas .htaccess tersebut dapat kita pahami maksudnya bahwa jika terjadi kesalahan dengan kode 404, maka request akan di-redirect menuju ke halaman error.html. Lalu di mana halaman error.html-nya? Tentu halaman tersebut juga harus kita buat. Dan halaman error.html juga harus diletakkan di root directory sama seperti berkas .htaccess. Sebagai contoh, halaman error.html yang saya buat adalah sebagai berikut:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Anda Tersesat?</title>
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
body {
}
#container {
width: 750px;
margin: 0 auto;
font-family: Lucida Grande, Tahoma, Arial, Helvetica, sans-serif;
color: #666666;
background-color: #ffffff;
border: 4px solid #000000;
}
#header {
background:#ffffff;
font-size:16px;
border-bottom:4px solid #000000;
}
#header h1 {
margin-top:30px;
margin-bottom:10px;
padding:0px 0px 0px 0px;
text-align:center;
background:#ffffff;
color:#000000;
font-family: Lucida Grande, Tahoma, Arial, Helvetica, sans-serif;
}
#footer {
height:50px;
border-top:solid 2px #000000;
font-size:12px;
}
#footer p,a {
margin-top:15px;
color:#000000;
text-align:center;
}
#footer a {
color:#bdb8b8;
text-decoration:none;
}
#footer a:hover {
color:#ef2d19;
}
.center {
float: center;
}
</style>
</head>
<body>
<div id="container">
<div id="header">
<h1>Anda Tersesat?</h1>
</div>
<center><img class="center" alt="Error 404 Not Found" title="Error 404 Not Found" src="404.jpg" /></center>
<div id="footer">
<p>Copyleft © 2011 Rabitya | Valid <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>.</p>
</div>
</div>
</body>
</html>
Nah, dengan demikian misalkan kita memiliki sebuah website dengan alamat http://rabitya.with-linux.com/, dan ada seseorang yang mengakses halaman http://rabitya.with-linux.com/rabitya-jelek.html, padahal halaman tersebut tidak ada (dan itu artinya saya tidak jelek :D), maka web server secara otomatis akan me-redirect ke halaman http://rabitya.with-linux.com/error.html (dengan catatan sudah ada berkas .htaccess dan halaman error.html sesuai dengan ketentuan di atas).
Contoh bisa anda download di sini. Contoh jadinya bisa anda simak di sini.
Cara ini juga bisa anda terapkan pada pesan kesalahan lainnya, misalkan Error 500 Internal Server Error. Sebagai informasi, pesan kesalahan yang terdapat pada HTTP Request secara lengkap bisa anda temukan di sini.
Sumber gambar: http://compassvgg.com
Tidak ada komentar:
Posting Komentar