Selamat Sore Sobat, pada sore kali ini saya akan membagikan sebuah tutorial Cara Membuat Halaman Error 404 alias halaman yang tidak ditemukan di blog. Sebagaimana kita tau jika url postingan tersebut telah kalian ubah atau sampai dihapus, akibatnya akan berpengaruh terhadap para pengunjung blog. Mereka yang membuka url salah (karena sudah diubah/dihapus) akan dialihkan ke halaman kosong. Hal tersebut membuat mereka merasa bingung, kesal, dan akhirnya meninggalkan blog kita. Dengan begitu juga, trafik/kunjungan ke blog kita lama-kelamaan akan menurun. Oke langsung aja simak tutorialnya.
Berikut Tutorialnya :
- Masuk Ke Dasbor Blog Sobat,
- Klik Menu Template,
- Klik Menu Edit Template,
- Masukan Kode Dibawah Ini Dbawah kode
<head>
<b:if cond='data:blog.pageType == "index"'>
<title><data:blog.pageTitle/></title>
<b:else/>
<b:if cond='data:blog.pageType == "error_page"'>
<title>404: Page Not Found ~ <data:blog.title/></title>
<b:else/>
<title><data:blog.pageName/> ~ <data:blog.title/></title>
</b:if>
</b:if>
- Setelah Itu Masukkan Kode CSS Ini Diatas Kode
</style>
#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;
}
#error-inner p {
line-height:0.7em;
font-size:15px;
}- Masukkan Juga Kode Dibawah Ini Diatas Kode
</body>
<b:if cond='data:blog.pageType == "error_page"'>
<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>
</div>
</b:if>
- Dan Terakhir Simpan Template, Siap untuk dicoba ^_^
Semoga Bermanfaat
^_^
