Cara Custom 404 Page Not Found Untuk Blogger

Zona Internetku No Comment September 29, 2018

Cara Mudah Untuk Custom Halaman 404 Page Not Found Pada Blog. Apa itu Page Not Found? Page Not Found merupakan sebuah halaman khusus untuk web atau blog yang menyatakan bahwa halaman tersebut tidak ditemukan alias tidak ada dan selalu ditandai dengan kode 404 pada internet.

Pada dasarnya halaman Page Not Found atau halaman tidak ditemukan sudah di sediakan oleh blogger, namun tampilan halaman tersebut sangatlah simpel dan membosankan. Maka dari itu saya akan memberikan tutorial kepada kalian untuk melakukan customisasi pada halaman 404 tersebut suapaya terlihat lebih keren di mata pengunjung

Baca juga :
Cara Mengatasi Error Pada Jumlah Postingan Di Homepage
Cara Mengatasi Widget Blog Related Post Yang Tidak Berfungsi

Cara Melakukan Customisasi Halaman Page Not Found 404 Di Blogger

1. Langkah pertama, masuk ke dalam blog kalian
2. Setelah itu pilih menu "Tema" dan pilih "Edit HTML"
3. Kemudian, kalian cari kode </body>
4. Langkah selanjutnya adalah salin script kode html untuk custom halaman page not found di bawah ini, dan letakkan di atas kode </body>

<!-- Error Page Start-->
<b:if cond='data:blog.pageType == &quot;error_page&quot;'>

<style>
#wrapper-error{text-align:center;z-index:1000;background:#fff;position:fixed;top:0;right:0;bottom:0;left:0;padding:0;font-weight:600;overflow:auto}
#wrapper-error h3,#wrapper-error h4{display:block;text-align:center;margin-bottom:30px;font-size:2rem;font-weight:700;color:#aaa}
#wrapper-error h3{margin-top:30px}#error-page{position:relative;max-width:940px;margin:25px auto;padding:20px;display:block;overflow:hidden;line-height:normal}
.error-msg{font-size:56px;font-weight:bold;line-height:normal;display:block;font-family:myriad pro}
.error-code{font-size:118px;line-height:normal;margin:20px auto;display:block;color:#d91e1e}
.error-submsg{color:#000;font-family:arial;font-size:30px}
.error-submsg a{background: rgba(217, 30, 30, 0.63);color: #fff;padding: 4px 3px;margin: 17px 4px;overflow: hidden;display: inline-block;text-decoration: none;border: 3px solid rgba(147, 5, 5, 0.6);}
.error-submsg a:hover{background:rgb(217, 30, 30)}
.copyright{font-family:arial;font-size:13px;color:#00000f}
@media screen and (max-width:768px){.error-msg{font-size:35px}.error-submsg{font-size:20px}.error-code{font-size:60px}}
</style>

<div id='wrapper-error'>
<div id='error-page'>
<span class='error-msg'>Page Not Found</span>
<span class='error-code'>404</span>
<span class='error-submsg'>Maaf, Halaman yang anda cari tidak ditemukan.<br/>
<a expr:href='data:blog.homepageUrl'>kembali ke Beranda</a></span>
<div class='copyright' style='clear:both'>
Copyright 2018. All Rights Reserved
</div>

</b:if>
<!-- Error Page End-->

5. Setelah selesai, klik "Simpan Tema" untuk menyimpan perubahan pada template kalian.
Untuk melihat hasil dari script Kode HTML Page Not Found silahkan kalian klik tombol demo di bawah ini

Demo

Baca juga :
Tutorial Menghilangkan Ikon QuickEdit Di Blog
Cara Memasang Kotak Iklan Responsive Di Blog
Cara Membuat Menu Navigasi Di Blog

Itu tadi adalah tuorial untuk Cara Custom 404 Page Not Found Blogger yang dapat saya share pada kalian, jika tampilannya kurang memuaskan silahkan di edit sendiri sekreatif mungkin. Semoga bermanfaat.

Promo Menarik