- Home >
- Tip & Trick >
- Kustomisasi Page Not Found 404 Blogger
Posted by : Unknown
Jumat, 13 September 2013

Postingan ini sebenarnya usaha saya untuk mencoba menjawab pertanyaan dari +Akiaki Lungguh tentang kustomisasi error 404 pada Blogger. Semoga betul apa yang saya utarakan hehehe...
Setelah saya telusuri ternyata cara membuat halaman error 404 pada blogger melalui Setelan pada Dashboard tidak bisa dilakukan pada setiap blog. Ada blog yang harus dilakukan lewat edit HTML untuk membuat kustomisasi halaman error 404 ini. Alasannya saya belum tahu pasti namun jika ternyata kustomisasi halaman error 404 ini tidak bisa Anda lakukan lewat Dashboard maka Anda harus lakukan lewat edit HTML.
Untuk itu saya memodifikasi sedikit script dari Akiaki Lungguh agar bisa sesuai dengan blog saya. Tampilannya hanya menampilkan halaman Page Not Found dengan menghilangkan elemen-elemen blog lainnya seperti menu, sidebar, dan lain-lain.
Jika ada yang tertarik untuk mencobanya, silahkan copy kode di bawah ini dan simpan di atas kode</body>.
<b:if cond='data:blog.pageType == "error_page"'>
<style type='text/css'>
.header-wrapper,.sidebar-wrapper,.sidebar2-wrapper,.sidebar3-wrapper,.sidebar4-wrapper,.sidebar5-wrapper,.sidebar6-wrapper,.breadcrumbs,#blog-pager,.post-footer, #comments,.hosting,#undertitle-wrapper,#top-menu,.creditwrap{display:none}
.main-wrapper{width:100%}
.outer-wrapper{width:100%}
#error-404 {text-align: center; transition: all 0.8s ease 0s;color: #b0130d; font-size: 150px; font-weight: bold;}
#error-404:hover {color: #333;}
.large-heading1 {font-size: 70px;margin-top:10%;}
.large-heading2 {font-size: 48px;}
.light-heading1 {font-size: 20px;font-weight: 400;}
.light-heading2 {font-weight: 400;}
</style>
<div class='large-heading1' style='text-align: center;'>OOPS!</div>
<div id='error-404'>404</div>
<div class='large-heading2' style='text-align: center;'>LAMAN TIDAK DITEMUKAN</div><br/>
<div class='light-heading1' style='text-align: center;'>Kami mohon maaf atas ketidaknyamanan ini</div><br/>
<div class='light-heading2' style='text-align: center;'>Silahkan kembali ke Halaman Utama <a href='http://www.kompiajaib.com/' title='Homepage'><b>Kompi Ajaib</b></a> dan gunakan <b>Search Box</b> untuk kembali mencari artikel yang Anda inginkan.<br/> atau laporkan jika ada kesalahan melalui <a href='http://www.kompiajaib.com/p/contact-us.html' title='Contact'><b>Contact</b></a>
</div></b:if>
Kode yang berwarna merah adalah elemen-elemen yang kita hilangkan seperti menu, sidebar, dan lain-lain silahkan sesuaikan dengan blog masing-masing. Dan untuk kode yang berwarna biru silahkan ganti dengan url blog dan kontak Anda.
Namun jika Anda ingin mencobanya melalui Dashboard blog silahkan hapus kode yang berwarna hijau. Silahkan Anda masuk ke Dashboard >> Settings/Setelah >> Search Preferences >> kemudian klik "edit" pada Custom Page Not Found.
Untuk mencoba penerapannya pada blog Anda silahkan ketikan url salah blog Anda seperti http://www.BLOG-ANDA.com/404errorpage.
Untuk kustomisasi Page Not Found 404 Blogger ini sendiri sudah banyak artikel yang membahasnya, silahkan saja Anda Googling, salah satunya artikel dari mas +Imron fhatoni dengan efek animasinya yang keren.
Untuk kustomisasi Page Not Found 404 Blogger ini sendiri sudah banyak artikel yang membahasnya, silahkan saja Anda Googling, salah satunya artikel dari mas +Imron fhatoni dengan efek animasinya yang keren.

