Penjelasan 404 Error Page for Blogger

Di sela-sela lagi males mosting (menerangkan), malah banyak sobat yang ingin ini, pengen itu tanpa melihat (bercermin) pada diri sendiri, sampai mana, punya apa, seberapa besar kemauan...untuk memahami, menginginkan, membuat sesuatu! Fenomena heboh Custom 404 Error Pages for Blogger sebagai contoh. Bila dipelajari dengan adem, sebenarnya trik dasar bermain kode CSS saja. Okelah Beben Koben si bloglang anu ganteng kalem tea akan coba terangkan sedetil-detilnya mengenai issue customize your search preferences :)
Apakah yang dimaksud dengan 404 error pages (HTTP 404)? read here HTTP 404. Pihak blogger sudah menambahkan kembali satu feature pada dashboard interface baru yakni search preferences. Ada apa saja disana: Meta tags, Errors and redirections, dan Crawlers and indexing. Benar enggak? Tertarik mempelajari hal tersebut, silahkan baca artikel @mybloggertricks settings for blogger 404 error page, redirects and meta tags and from @way2blogging blogger seo is made easy with new search preference option!

Koben akan fokuskan bahas pada urusan "Custom Page Not Found" Yang lain silahkan pelajari masing² :P
Secara default (belum diapa-apakan), jika sobat blogger menemukan link pada sebuah blog tidak ada (error, delete) akan ada sebuah pemberitahuan. Like this:

Sorry, the page you were looking for in this blog does not exist.

Sorry, the page you were looking for in this blog does not exist.

Untuk mengetahui hal itu, silahkan kalian bubuhi di belakang link blog kalian masing² dengan embel² apapun (ex: http://beben-koben.blogspot.com/WTF) Default result will be as above!
Coba sekarang kamu bubuhkan kalimat pada kotak Custom Page Not Found!


Otomatis tulisan "Sorry, the page you were looking..." akan berganti menjadi Oops! We couldn't Find that :( Kenapa bisa begitu? Sebab pada template blogger sudah tertanam kode<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>Coded tersebutlah yg menjadikan tulisan itu berubah tampak. Ngerti? Ini kalau mau melihat dalaman kode CSS-nya

Click to look

.status-msg-wrap {
font-size: 110%;
width: 90%;
margin: 10px auto;
position: relative
}
.status-msg-border {
border: 1px solid #000;
filter: alpha(opacity=40);
-moz-opacity:.4;
opacity:.4;
width: 100%;
position: relative
}
.status-msg-bg {
background-color: #ccc;
opacity:.8;
filter: alpha(opacity=30);
-moz-opacity:.8;
width: 100%;
position: relative;
z-index: 1
}
.status-msg-body {
text-align: center;
padding:.3em 0;
width: 100%;
position: absolute;
z-index: 4
}
.status-msg-hidden {
visibility: hidden;
padding:.3em 0
}
.status-msg-wrap a {
padding-left:.4em;
text-decoration: underline
}

Jelas?
Sekarang bagaimana mau meng-customize pesan error 404 itu menjadi lebih full stylish? Mau!

Simpel dan sederhana namun tetap memerlukan ketelitian. Backup template 100% full, OK! Lakukan Expand Widget Templates. Temukan kode berikut<b:include data='top' name='status-message'/>Gantikan semua dengan kode ini<b:if cond='data:blog.pageType == "error_page"'>
<b:include name='404-block'/>
<b:else/>
<b:include data='top' name='status-message'/>
</b:if>Kembali temuin kode<b:includable id='status-message'>Tepat diatasnya, taruh code brkt<b:includable id='404-block'>
<div id='custom-404-block'>
<h2>404</h2>
<div>Oops… Page Not Found!</div>
</div>
</b:includable>Ganti kata² sesuai keinginan! SAVE dulu deh. Urusan CSS kalian bs membuat sesuka hati. Yang penting kembali unik ID harus tepat sasaran :) Contoh#custom-404-block {
color:grey;
font-size:50px
}
#custom-404-block h2 {
color:grey;
font-size:120px;
text-align: center ;
}Jelas? Tutorial yang datang dari @bloggerplugins lebih hebat, kalian akan tahu bagaimana cara mengganti judul link dari error 404 ini custom 404 error pages for blogger. My Practice

Itu semua belum melakukan snippet kode template apa² yg mau dihilangkan. Singkat cerita snippet begini. Buka blog ini dalam keadaan normal http://vagabundia.blogspot.com/ bandingkan dengan ini http://vagabundia.blogspot.com/2012/03/estaentradanoexiste.html Apa yg hilang! sidebar, footer, and etc right? Itulah snippet CSS :-/
Happy coding