Cara Menambahkan Custom Halaman Error 404 Pada Blog

Cara Menambahkan Custom Halaman Error 404 Pada Blog - Menambahkan halaman error 404 pada blogger itu perlu ya sob, tapi jangan hingga ada sedikit pun halaman error pada blog sahabat niscaya akan menjadikan efek yang kurang anggun pada search engine Google tentunya.

Error 404 yaitu halaman yang biasanya tampil jikalau link yang dibuka error maupun juga dapat salah ketik, aku ingat kan lagi coba sahabat cek terlebih dahulu pada blog sahabat ada ngggak yang broken link ( Link Rusak ).

Baca Juga : Cara Mengecek dan Mengatasi Broken Link pada Blog

Cara Menambahkan Custom Halaman Error 404 Pada Blog

Pertama sahabat masuk terlebih dahulu ke Blogger > Tema > Edit HTML copy aba-aba dibawah ini dan pastekan sempurna diatas aba-aba </head>

<b:if cond='data:blog.pageType == &quot;error_page&quot;'> <style type='text/css'> /* CSS Error 404 */ #oopss{background:#222;text-align:center;margin-bottom:50px;font-weight:400;font-size:20px;position:fixed;width:100%;height:100%;line-height:1.5em;z-index:9999;left:0}#error-text{top:30%;position:relative;font-size:40px;color:#eee}#error-text a{color:#eee}#error-text a:hover{color:#fff}#error-text p{color:#eee;margin:70px 0 0}#error-text i{margin-left:10px}#error-text p.hmpg{margin:40px 0 0}#error-text span{position:relative;background:#ef4824;color:#fff;font-size:300%;padding:0 20px;border-radius:5px;font-weight:bolder;transition:all .5s;cursor:pointer;margin:0 0 40px}#error-text span:hover{background:#d7401f;color:#fff;-webkit-animation:jelly .5s;-moz-animation:jelly .5s;-ms-animation:jelly .5s;-o-animation:jelly .5s;animation:jelly .5s}#error-text span:after{top:100%;left:50%;border:solid transparent;content:'';height:0;width:0;position:absolute;pointer-events:none;border-color:rgba(136,183,213,0);border-top-color:#ef4824;border-width:7px;margin-left:-7px}.back:active{-webkit-transform:scale(.95);-moz-transform:scale(.95);transform:scale(.95);background:#f53b3b;color:#fff}.back:hover{background:#4c4c4c;color:#fff}.back{text-decoration:none;background:#5b5a5a;color:#fff;padding:10px 20px;font-size:20px;font-weight:700;line-height:normal;text-transform:uppercase;border-radius:3px;-webkit-transform:scale(1);-moz-transform:scale(1);transform:scale(1);transition:all .5s ease-out}@-webkit-keyframes jelly{from,to{-webkit-transform:scale(1,1);transform:scale(1,1)}25%{-webkit-transform:scale(.9,1.1);transform:scale(.9,1.1)}50%{-webkit-transform:scale(1.1,.9);transform:scale(1.1,.9)}75%{-webkit-transform:scale(.95,1.05);transform:scale(.95,1.05)}}@keyframes jelly{from,to{-webkit-transform:scale(1,1);transform:scale(1,1)}25%{-webkit-transform:scale(.9,1.1);transform:scale(.9,1.1)}50%{-webkit-transform:scale(1.1,.9);transform:scale(1.1,.9)}75%{-webkit-transform:scale(.95,1.05);transform:scale(.95,1.05)}}@media only screen and (max-width:640px){#error-text span{font-size:200%}#error-text a:hover{color:#fff}} </style> </b:if>

Kemudian tambahkan aba-aba dibawah ini sempurna diatas aba-aba </body>

<b:if cond='data:blog.pageType == &quot;error_page&quot;'> <div id='oopss'> <div id='error-text'> <span>404</span> <p>PAGE NOT FOUND</p> <p class='hmpg'><a expr:href='data:blog.homepageUrl' class="back">Back To Home</a></p> </div> </div> </b:if>

Jika sudah klik simpan pada template sobat.

Oke sekian yang dapat aku sampaikan tentang Cara Menambahkan Custom Halaman Error 404 Pada Blog Terima Kasih yang sudah berkunjung agar bermanfaat bagi kalian semua.


Sumber https://www.triksimple.com/

Bagikan Artikel ini