Halaman Error 404 ialah isyarat halaman error dimana pengunjung salah dalam pengetikan URL atau pengunjung telah mengunjungi URL yang telah di hapus pada sebuah Website atau situs. Berikut ini aku akan share cara menciptakan halaman 404, fitur ditawarkan pada halaman 404 ini Responsive, Smooth, Support CSS3, Simple dan Fast.
Untuk menciptakan halaman 404, anda dapat ikuti langkah-langkahnya dibawah ini, namun sebelum proses penerapan anda dapat melihanya screnshotnya dibawah ini :
Berikut ini caranya :
1. Login ke Blogger
2. Pilih Template >> klik Edit HTML
3. Selanjutnya cari kode ]]></b:skin>
4. Lalu Anda salin isyarat dibawah ini dan pastekan diatasnya :
5. Kemudia anda cari isyarat <body> lalu letakkan isyarat dibawah ini diatasnya
6. Masih pada letak yang sama, letakkan juga isyarat berikut ini dibawah isyarat diatas
5. Simpan Template
Setelah script diatas ditambahkan pada Editor template , dan jikalau ingin mencobanya silahkan tuliskan http://URL Blog/404 ( ganti URL Blog dengan alamat blog Anda ).
Demikian Cara Membuat Halaman Error 404 di Blog, biar bermanfaat!
Sumber http://www.websiteedukasi.com/
Untuk menciptakan halaman 404, anda dapat ikuti langkah-langkahnya dibawah ini, namun sebelum proses penerapan anda dapat melihanya screnshotnya dibawah ini :
Berikut ini caranya :
Cara Membuat Halaman Error 404 di Blog
1. Login ke Blogger
2. Pilih Template >> klik Edit HTML
3. Selanjutnya cari kode ]]></b:skin>
4. Lalu Anda salin isyarat dibawah ini dan pastekan diatasnya :
/* error page */
#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-page #search-box {margin: 2% 41%}#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;}
#error-inner p {line-height:0.em;font-size:15px;}
#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-page #search-box {margin: 2% 41%}#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;}
#error-inner p {line-height:0.em;font-size:15px;}
5. Kemudia anda cari isyarat <body> lalu letakkan isyarat dibawah ini diatasnya
<b:if cond='data:blog.pageType == "error_page"'>
6. Masih pada letak yang sama, letakkan juga isyarat berikut ini dibawah isyarat diatas
<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=='')this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=''' type='text' value='Cari di sini ...'/>
<button id='search-button' type='submit'/>
</form>
</div>
</div>
</div>
</b:if>
<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=='')this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=''' type='text' value='Cari di sini ...'/>
<button id='search-button' type='submit'/>
</form>
</div>
</div>
</div>
</b:if>
5. Simpan Template
Setelah script diatas ditambahkan pada Editor template , dan jikalau ingin mencobanya silahkan tuliskan http://URL Blog/404 ( ganti URL Blog dengan alamat blog Anda ).
Demikian Cara Membuat Halaman Error 404 di Blog, biar bermanfaat!
Sumber http://www.websiteedukasi.com/
