Membuat Halaman 404 Tampak Seperti BSoD

Alzea | 4 comments

Apa itu BSoD?


Blue Screen Of Death (BSoD) cukup di kenal di lingkungan Windows. Ciri-ciri dari BSoD adalah, ketika anda sedang asik2 bermain dng windos anda, lalu tiba2 tanpa alasan yg jelas, komputer anda berubah menjadi layar biru dengan pesan2 error dalam bahasa dewa yg sulit di mengerti orang awam, dan anda harus me-restart komputer anda... Yup, itulah BSoD. Menyeramkan bukan?  :P


Nah, disini kita akan memodifikasi halaman "error 404 not found" yang membosankan itu, menjadi halaman error yg lebih kreatif. Nanti bentuk nya akan seperti ini :



Mirip kan dengan asli nya? Gak susah kok bikin nya... Ini source code nya :




Membuat HTML


Buatlah file dengan nama 404.html, dan isikan kode berikut :
<html>
<head>
<title>- ooops! -</title>
<link rel="stylesheet" href="404.css" type="text/css" media="all" />
</head>
<body>
<span class="neg">ERROR 404</span>
<p>
The page is missing or never was written. You can wait and<br />
see if it becomes available again, or you can restart your computer.
</p>
<p>
* Send us an e-mail to notify this and try it later.<br />

* Press CTRL+ALT+DEL to restart your computer. You will<br />
   lose unsaved information in any programs that are running.
</p>
Press any link to continue <blink>_</blink>
<div class="menu">
<a href="index.html">index</a> |
<a href="contact.html">webmaster</a> |
</div>

</body>
</html>

 


Membuat CSS


Buat file 404.css, dan isikan kode berikut :



body {
    background:#0000aa;
    color:#ffffff;
    font-family:courier;
    font-size:12pt;
    text-align:center;
    margin:100px;
}

blink {
    color:yellow;
}

.neg {
    background:#fff;
    color:#0000aa;
    padding:2px 8px;
    font-weight:bold;
}

p {
    margin:30px 100px;
    text-align:left;
}

a,a:hover {
    color:inherit;
    font:inherit;
}

.menu {
    text-align:center;
    margin-top:50px;
}

Membuat halaman 404 error pada server Apache


Jika Anda menggunakan server web Apache, itu sangat mudah untuk membuat halaman 404 anda sendiri. Setelah Anda upload 404.html dan 404.css file pada server Anda, edit file htaccess (Jika Anda belum memiliki file htaccess pada direktori root server Anda, membuat satu.) dan menambahkan direktif berikut.:



ErrorDocument 404 / 404.html

Kode ini cukup mudah dipahami: Jika file yang diminta tidak ditemukan oleh Apache, pengunjung akan secara otomatis diarahkan ke halaman error 404 BSOD buatan anda.



Membuat halaman 404 pada Wordpress.


Jika Anda adalah pengguna WordPress, sangatlah mudah membuat halaman error 404 anda sendiri. Browse file theme, serta temukan file bernama 404.php. Jika file ini tidak ada, bisa buat satu. Kemudian, sisipkan kode html di atasnya, dan jangan lupa untuk meng-upload file css nya juga.


Selesai... Selamat berkreasi...  :)

Labels:  ,

Author: Alzea

Date: Senin, 14 Maret 2011

4 comments  | Leave a comment

4 comments to "Membuat Halaman 404 Tampak Seperti BSoD"

Teguh Aprianto 14 Maret 2011 pukul 11.16
Mantap banget tutornya om naisen. Ntar mau ane coba.
febrian 15 Maret 2011 pukul 01.54
izin nyoba trin-nya om naisen...!!!!!
Membuat Halaman 404 Tampak Seperti BSoD 14 Mei 2011 pukul 07.14
[...] Sumber : http://www.blog.alzea.net/membuat-halaman-404-tampak-seperti-bsod.html#more-699 [...]
dani 18 Juni 2011 pukul 21.01
thnks om naisen :)

Posting Komentar