Pemakaian 404 Error Page for Blogger

Setelah google mengenalkan search preferences for blogger, otomatis terjadi perubahan disana-sini terhadap kinerja blogger itu sendiri. Yang lagi hangat santer dibicarakan oleh para master blogger yaitu mengenai HTTP 404 atau yg lebih dikenal dengan 404 error page. Banyak sih sebutannya mah, tidak tahu ada berapa, yg pasti tujuannya sama, memberitahukan halaman yg dimaksud tidak ada :))
Sekarang Beben Koben si bloglang anu ganteng kalem tea akan berbagi yg lagi hangat itu, cara membuat halaman error 404 untuk blogger b-) Mari kita babat kreasi master² dari negara spanyola tentang si error page :D
Pertama datang dari master @Ciudad_Blogger, please read (spain language) :P crear página de error 404 en blogger.
Hampir kelupaan nih, sobat harus dalam mode updated blogger interface dulu yah (editor baru) untuk melakukan semua hack ini ;)

Selalu backup download full template sebelum melakukan utak-atik kode ;) Expand Widget Templates kalian, temukan kode<b:include data='top' name='status-message'/>Kalau sudah ada is good, kalau belum ada kalian harus menuliskannya dulu :P Pasti sudah ada kebanyakan bawaan default template blog mah.
Dalam mode editor anyar klik tulisan Settings ► Search preferences. Pada bagian Errors and redirections sobat pilih & klik Edit Custom Page Not Found. Isikan kode berikut didalam kotak!

<div id="error-404">
<div class="error1-404">
<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSumKBtn70Uy0rMU7ipQQyJo46WquUFrShX0bBXEgFoYJf69l2oRgzrIfNM_O4vyM6Yq9i4tT3kOfwZAlIPUgvSm6DHM5soJ6q4DXajNFXxKFjClrgYrVvxJ6aYnIh_6C-8_91fs9gufM/s100/error.png" style="vertical-align:middle"/> OMG!</div>
<div class="error2-404">Halaman tidak ditemukan</div>
<div class="error3-404">Sepertinya ada kesalahan dengan halaman yang anda cari.<br/>Ada kemungkinan entri telah dihapus atau alamat sudah tidak ada.</div>
<div class="error4-404"><a href='http://YOUR-NAME-BLOG.blogspot.com'>Back To</a></div>
</div>

YOUR-NAME-BLOG gantikan dengan tujuan link lain, terserah!
Save changes.
Klik template ► Edit HTML ► Proceed, temukan ]]></b:skin> masukin bumbu CSS brkt

#error-404 {
padding:10px;
text-align:center;
}
.error1-404 {
color: #fff;
font-size: 90px;
font-weight: bold;
text-transform: uppercase;
color: #d00;
}
.error2-404 {
color: #fff;
font-size: 35px;
font-weight: bold;
text-transform: uppercase;
text-shadow: 0 1px 0 #ccc, 0 2px 0 #C9C9C9, 0 3px 0 #bbb, 0 4px 0 #B9B9B9, 0 5px 0 #aaa, 0 6px 1px rgba(0, 0, 0, 0.1), 0 0 5px rgba(0, 0, 0, 0.1), 0 1px 3px rgba(0, 0, 0, 0.3), 0 3px 5px rgba(0, 0, 0, 0.2), 0 5px 10px rgba(0, 0, 0, 0.25), 0 10px 10px rgba(0, 0, 0, 0.2), 0 20px 20px rgba(0, 0, 0, 0.15);
}
.error3-404 {
padding: 5px;
color: #333;
text-shadow: 1px 2px 3px #fff;
font-size: 20px;
padding: 10px;
}
.error4-404 {
margin-top: 20px;
padding: 10px;
display: inline-block;
text-shadow: 0 1px 1px #fff;
font: bold 13px Sans-Serif;
border: 1px solid #DDD;
background: #EEE;
}

Save template.
Ini yg sedikit memerlukan skill masing² dari kalian. Karena UnikID template pasti berbeda-beda adanya. Karena pada bagian ini kita akan memasukan teknik snippet, agar penampilan error page sesuai keinginan. Seperlunya saja bubuhkan variabel pada CSS ;)

Cari kode </head> tepat sebelum/diatasnya letakan snippet code berikut<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<style type='text/css'>
UNIK ID TEMPLATE YG AKAN DIHILANGKAN
{
display:none;
}
.status-msg-wrap, .status-msg-body, .status-msg-border, .status-msg-bg, .status-msg-hidden
{

}
</style>
</b:if>UNIK ID TEMPLATE YG AKAN DIHILANGKAN biasanya sering dengan kode #sidebar/#sidebar-wrapper/#right-wrapper/... taruhlah disitu. Untuk .status-msg-wrap, .status-msg-body, .status-msg-border, .status-msg-bg, .status-msg-hidden bisa kalian pisah² tergantung mau dipasang variabel CSS apaan disana. Ingat apa yg saya tadi bilang (seperlunya)!
Contoh penerapan

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<style type='text/css'>
#sidebar-wrapper, #TextList1, #nav, .feed-links{
display:none
}
#main-wrapper{width:650px} 
.status-msg-wrap,.status-msg-body,.status-msg-border {
width: 625px;
border: none
}
</style>
</b:if>

Lihat hasil kerja :) DEMO http://nombre-de-mi-blog.blogspot.com/error.html
Pemilik blog Emilio Cobos berkreasi dengan javascript kepunyaan google, mirip dengan postingan Koben sebelumnya, tetapi sudah dibubuhi bumbu CSS nih sob ;))

Kalau mau pakai hasil kreasinya, sobat hanya perlu melakukan
Settings ► Search preferences ► klik edit Custom Page Not Found ► masukin ini semua

<style>
.status-msg-body{position:relative!important}
.status-msg-border{display:none!important}
.contenedor h1 {
font-weight: 600;
margin: 0 10px;
font-size: 50px;
text-align: center;
}
.contenedor h1 span { color: #bbb; }
.contenedor h3 {
margin: .8em 0 .3em;
font-size:25px;
}
.contenedor ul{
list-style-type:disc;
padding: 0 0 0 40px;
margin: 1em 0;
}
.contenedor {
text-align:left;
width: 380px;
margin: 0 auto;
color:#515151;
font-weight: 600;
font-size: 16px;
box-shadow: 0 0 10px #bbb;
background: white;
padding:30px;
}
.contenedor, .contenedor input {
font-family: "Open Sans","Helvetica Neue", Helvetica, Arial, sans-serif;
}
#goog-wm .content{text-align: center}
#goog-fixurl ul {
list-style: none;
padding: 0;
margin: 0;
}
#goog-fixurl form {
margin: 0;
text-align: center;
}
#goog-wm-qt, #goog-wm-sb {
border: 1px solid #bbb;
font-size: 16px;
line-height: normal;
vertical-align: top;
color: #444;
border-radius: 2px;
}
#goog-wm-qt {
width: 220px;
height: 20px;
padding: 5px;
margin: 5px 10px 0 0;
box-shadow: inset 0 1px 1px #ccc;
}
#goog-wm-sb {
font-weight: bold;
display: inline-block;
height: 32px;
padding: 0 10px;
margin: 5px 0 0;
background-color: #f5f5f5;
}
#goog-wm-sb:hover, #goog-wm-sb:focus {
border-color: #aaa;
box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
background-color: #f8f8f8;
}
#goog-wm-qt:focus, #goog-wm-sb:focus {
border-color: #105cb6;
outline: 0;
color: #222;
}
</style>
<div class="contenedor">
<h1>Error 404 <span>:(</span></h1>
<p>Maaf, halaman yang anda cari tidak ada.</p>
<p>Mungkin error:</p>
<script type='text/javascript'>
var GOOG_FIXURL_LANG = 'in';
var GOOG_FIXURL_SITE = 'location.host'
</script>
<script src='http://linkhelp.clients.google.com/tbproxy/lh/wm/fixurl.js' type='text/javascript'></script>
</div>

Master @vagabundia bereksperimen dengan melakukan penanaman kode di static pages, dibubuhi sentuhan JavaScript redirect, sehingga nanti akan tertuju ke sana :-bd usar error_page para crear páginas de error 404.
Bagaimana sobatku, bingungkan!!! :)) Intinya yaaa kalian harus tetap cemungut agal bial pandai menjadi ceolang mastel blogger :D
Happy error page \m/