Sunday 12 April 2015

Cara Membuat Halaman Error 404

          404 Adalah Kode Halaman Error yang biasa muncul pada setiap halaman web/blog ketika seorang visitor (pengunjung) mengunjungi url yang terhapus / salah dalam pengetikan. Nah, kali ini saya ingin berbagi tutorial "Bagaimana Cara Membuat Halaman Error 404 di Blog ala Aris" untuk di pasang pada blog sobat.

Untuk sobat yang penasaran bagaimana tampilan halaman 404 yang saya maksud, silahkan lihat Demo / lihat screenshot halaman 404 error di bawah ini : 

Keunggulan

  • Responsive
  • Smooth
  • Support CSS3
  • Simple & Fast

Cara Pemasangan

Langkah 1 - Login Blogger, buka menu Template → Edit HTML lalu simpan kode di bawah ini tepat setelah kode <body> :
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
Kalau tidak menemukan <body> Silahkan Klik Cara mencari kode Body

Langkah 2 - Simpan kode di bawah ini tepat di atas kode </body> :
</b:if><b:if cond='data:blog.pageType == &quot;error_page&quot;'><link rel='stylesheet' type='text/css' href='https://googledrive.com/host/0B7H_GQEvKCj1cUVkYy1jbXpqZW8/404-error.css'/><link href='http://fonts.googleapis.com/css?family=Changa+One' rel='stylesheet' type='text/css'/><link href='http://fonts.googleapis.com/css?family=Open+Sans:400' rel='stylesheet' type='text/css'/><div id='error-page'><!-- Halaman Error --><!-- #404 --><div id='error-halaman'><div class='comingcontainer'><div class='checkbacksoon'><p><span class='go3d'>4</span><span class='go3d'>0</span><span class='go3d'>4</span><span class='go3d'>!</span></p><p class='error-bro'> Mohon maaf, Halaman yang Anda cari tidak ditemukan!<br/> Kemungkinan halaman telah dihapus, atau Anda salah menuliskan URL.<br/>Silahkan kembali ke<a class='tombol' href='/' style='box-shadow:none;color:#444;'>Halaman Pertama</a></p></div></div></div><!-- #404 --></div></b:if>

Terakhir - Simpan Template!

Untuk mencoba-nya tinggal tuliskan http://nama-blog-sobat.blogspot.com/404 ( ganti nama-blog-sobatdengan alamat blog sobat )

Selesai, Semoga Bermanfaat kawan , silahkan share jika bermanfaat :)
Load disqus comments

0 komentar