Membuat Halaman 404 Not Found di Blog

Mungkin halaman 404 Not Found atau "halaman tidak ditemukan" bukanlah sesuatu yang penting tetapi, mungkin sobat pernah membagikan url artikel blog sobat di sosial media seperti facebook, twitter, youtube atau lain sebagainya. Akan tetapi lain soalnya jika artikel yang sobat bagikan sudah sobat hapus maka yang akan terjadi bila ada pembaca/pengunjung yang mengakses halaman tersebut akan menjumpai halaman yang kosong. Hal demikian dapat membuat pengunjung anda merasa bingun dan berakibat meninggalkan blog sobat.

Maka dari itu halaman 404 Not Found pada blog sangat bermanfaat untuk memberitahukan pada pengunjung bahwa postingan atau halaman yang sedang dicari tidak ada atau sudah dihapus. Silahkan sibak bagaimana cara membuatnya.

Membuat Halaman 404 Not Found di Blog

• Masuk akun Blogger.com
• Kemudian klik Template -> Edit Template
• Cari kode "]]></b:skin>" kemudian tarus script dibawah tepat diatas ]]></b:skin>

/*Desain Halaman 404 Error Not Found
----------------------------------------------- */
#error-page {
background-color:#e9e9e9;
position:fixed !important;
position:absolute;
text-align:center;
top:0;
right:0;
bottom:0;
left:0;
z-index:99999;
}
#error-inner {
margin:11% auto;
}
#error-inner .box-404 {
width:200px;
height:200px;
background:#21afa4;
color:#fff;
font-size:80px;
line-height:200px;
border-radius:10px;
margin:0 auto 50px;
position:relative;
}
#error-inner .box-404::after {
content:" ";
width:0;
height:0;
bottom:-8px;
border-color:#21afa4 transparent transparent;
border-style:solid;
border-width:9px 9px 0;
position:absolute;
left:47%;
}
#error-inner h1 {
text-transform:uppercase;
}
#search-box{position:relative;width:350px;margin:10px auto}
#cse-search-box{height:30px;border-radius:2px;background-color:#fff;overflow:hidden;border:1px solid #bbb}
#search-text{font-size:12px;color:#ddd;border-width:0;background:transparent}
#search-box input[type="text"]{width:85%;padding:5px 20px 12px 0;color:#666;outline:none}
#search-button{position:absolute;top:0;right:0;height:32px;width:20px;margin-top:10px;font-size:14px;color:#fff;text-align:center;line-height:0;border-width:0;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOQWBbvavTXaaZiHXQhDeNuc7GSVR36CHoAFiUwpQUsacl9q06JF2So-pKoobDpoVE0qzABsFB4NVlVxkhEzwLroiOci8rBVksE0MYhnhQCIO4T3js-AwNlDhHEz-gdGcDX8BahM8XnjE/s200/search-c.png) no-repeat;cursor:pointer}
#error-inner p {
line-height:0.7em;
font-size:15px;
}

•  Masukkan juga kode berikut diatas kode </body>

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<div id='error-page'>
<div id='error-inner'>
<div class='box-404'>404</div>
<h1>Halaman tidak ditemukan</h1>
<p>Kemungkinan halaman telah dihapus, atau Anda salah menulis URL</p>
<p>Kembali ke <a expr:href='data:blog.homepageUrl'><data:blog.title/></a></p>
<div id='search-box'>
<form action='/search' id='cse-search-box' method='get'>
<input id='search-text' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;' type='text' value='Cari di sini ...'/>
<button id='search-button' type='submit'/>
</form>
</div>
</div>
</div>
</b:if> 

•  Untuk penutupan klik SIMPAN dan beres.

Sekian Membuat Halaman 404 Not Found di Blog. semoga bermanfaat.