Tutorial Membuat Custom Error Page
1. Beranda Blog > Template > Edit HTML2. Pasang kode dibawah diatas kode </head>
<b:if cond='data:blog.pageType == "error_page"'>
<style type='text/css'>
.ct-wrapper, .header-wrapper, #header, #post-wrapper, #outer-wrapper, #footer-wrapper, #sidebar-wrapper, #credit, #social_networks {display:none;}
.error-container{background-image: url(http://1.bp.blogspot.com/-zHS2luoiNTM/VTZJiQmK7RI/AAAAAAAAJxw/D1Kiy-euLXM/s1600/blog-bg.jpg);background-size:cover;}
.error-header{margin-top:-100px}
.error-title{line-height:42px}
.error-title span{background:#d44929;padding:2px 10px;}
.error-image img{display:block;font-size:72px;font-weight:700;height:150px;margin:10px auto 40px}
.error-container{background-color:#101524;display:table;height:100vh;overflow-x:hidden;width:100%}
.error404 .anonymous{margin:0 auto 20px;display:block}
.error-404{background:rgba(0,0,0,.7);display:table-cell;vertical-align:middle}
.error-404 .page-content p{color:#c8c8c8}
.error-title{color:#fff;font-family:'Open Sans',sans-serif;font-size:42px;font-weight:700;text-transform:uppercase;margin:.67em 0;text-align:center;line-height:normal;}
.search-title{font-size:48px;color:#3f3f46}
.page-content,.page-content p{color:#797979;font-size:18px;text-align:center}
a.btn.back-to-home{background:#4fafe9;color:#fff;font-weight:400;left:40px;line-height:24px;padding:10px 30px;position:absolute;text-transform:capitalize;top:40px;z-index:99;border-radius:4px}
a.back-to-home:hover{background:#459dd3;color:#fff;}
a.back-to-home i{font-size:14px;margin-right:3px}
@media only screen and (max-width:479px){
.back-button-container{max-width:80%;width:80%}.page-content .back-to-home{width:100%;margin:10px auto}.error-header{margin-top:30px}.error-title{font-size:24px;line-height:32px}.page-content,.page-content p{font-size:14px}.error-404{padding-bottom:60px}.page-footer{padding:20px 10px}}
</style>
</b:if>
Sobat bisa custom sendiri tampilannya sesuai selera
3. Kemudian pasang juga kode dibawah,tepat dibawah <body>
<b:if cond='data:blog.pageType == "error_page"'>
<div class='error-container'>
<a class='btn back-to-home' expr:href='data:blog.homepageUrl'><i class='fa fa-home fa-fw'/>Kembali Ke Beranda</a>
<section class='error-404 not-found text-center'>
<header class='error-header'>
<div class='error-image'>
<img alt='404' src='http://1.bp.blogspot.com/-Gb2gYMW4VC0/VTZJg0pSIrI/AAAAAAAAJxo/CXhWMecSCNI/s1600/anonymous.png'/>
</div>
<h1 class='error-title'><p><span>Maaf!</span> Halaman Tidak Ditemukan.</p> </h1>
</header>
<div class='page-content'>
<p>Mungkin Telah Dihapus Atau Tidak Terserdia.</p>
</div>
</section>
</div>
</b:if>
4. Simpan Template,SelesaiSilahkan dicoba gan,Sekian- Silahkan bertanya jika ada kesulitan
Posting Komentar