Halo sobat blogger, bagaimana kabar kalian, sehat bukan 😀. Semoga kita semua selalu diberikan kesehatan dan tidak kekurangan suatu apapun, sehingga apa yang akan kita kerjakan dapat ditangani dengan baik, jadi selalu jaga kesehatan ya sob, 😀
Semua pasti tahu apa itu 404 ? Iyah, benar sekali, saat halaman yang kita akses atau kita kunjungi tidak tersedia entah karena memang tidak ada maupun sudah dihapus, maka secara otomatis pesan error 404 not found ini akan ditampilkan.
Sebenarnya tanpa custom inipun pesan error 404 not found sudah disediakan oleh blogger, namun disini saya coba membagikan tips dan trik membuat custom 404 not found untuk blog yang keren, sehingga bisa menggantikan 404 not found bawaan blogger.
Berikut script code listingnya :
<style>
@import url('https://fonts.googleapis.com/css?family=Ruda:400,700');
#gantex404 {background-color:#eceeee;color:#fff;text-align:center; margin:auto; font-weight:700; font-size:45px; font-family:'Ruda',sans-serif; position:fixed; width:100%; height:100%;top:0;right:0;bottom:0;left:0;padding:0; line-height:1.25em; z-index:9999;}
#error-text {position:relative; font-size:40px; color:#666; top:50%; right:50%; transform:translate(50%,-50%);}
#error-text a {color:#888; text-decoration:none}
#error-text p {margin:0!important; letter-spacing:.5px;}
#error-text span {color:#008c5f;font-size:100px;}
#error-text a.back {background:#008c5f;color:#fff;padding:10px 20px;font-size:20px;border:2px solid #fff;border-radius:5px;-webkit-transform:scale(1);-moz-transform:scale(1);transform:scale(1);transition:all 0.5s ease-out;}
#error-text a.back:hover {background:#444;color:#fff;border:2px solid #eceeee;}
#error-text #copyright {font-size:16px}
#error-text #copyright a {color:#008c5f}
</style>
<div id='gantex404'>
<div id='error-text'>
<span>404</span>
<p>MAAF HALAMAN TIDAK DITEMUKAN!</p>
<p><a class='back' href='/' expr:title='data:blog.title'>Kembali Ke Halaman Awal</a></p>
<div id='copyright'>
<a href='/' expr:title='data:blog.title'><data:blog.title/></a> © 2010 - <script>document.write(new Date().getFullYear()) </script>. Kang GanteX
</div>
</div>
</div>
Copy seluruh script code diatas, kemudian masukkan atau pastekan di dalam 404 custom blog yang ada pada pengaturan. Buka blog kemudian masuk ke pengaturan, scroll kebawah sampai ke menu error dan pengalihan. Lihat gambar dibawah untuk lebih jelasnya.
Kemudian pilih 404 khusus, pastekan atau letakkan script code yang di copy tadi ke sini, lihat gambar untuk lebih jelasnya. Jika dirasa sudah yakin benar, simpan dan lihat hasilnya.
Untuk menguji apakah custom error 404 berhasil atau tidak coba akses halaman blog, kemudian setelah url blog tambahan nama halaman atau page yang tidak ada di blogger sobat semua. Semisal url sobat kemudian tambahkan page setelah url dengan menambah slash / page-kosong. Selamat mencoba sob,,
Kesimpulan : Dengan membuat custom 404 not found ini, maka kita leluasa merubah tampilannya sesuai dengan selera sebagai pengganti 404 not found bawaan blog. Jadi nantinya halaman error 404 not found blog kita akan terlihat lebih menarik.
Disini saya selalu berusaha menggunakan bahasa umum yang mudah dipahami, bukan bahasa teknik yang malah membuat pusing dan bertannya - tanya.
Terima kasih, Sudah membaca artikel ini dan berkunjung ke blog
kanggantex.blogspot.com. Saya nantikan kunjungan Anda berikutnya.
Warm regard, Kang GanteX
