Template Error 404 (Not Found) Seperti Milik Google


Coretancode.com - Pada kesempatan kali ini admin ingin memberikan sebuah template keren dan unik yang mungkin anda sukai dan ingin miliki sejak lama tapi belum kesampaian apakah itu? Templatenya itu adalah Halaman Error 404 (Not Found) seperti yang dimiliki dan digunakan oleh Google.

Template ini admin buat disela-sela kesibukan diluar kegiatan blogging. Banyak sekali permintaan dari para sobat Coretancode yang menghubungi admin melalui halaman kontak agar membuatkan template semacam ini. Tentu, dengan senang hati admin akan membuatkannya disela-sela aktifitas diluar blogging jika kesibukannya bisa selingi untuk editing.

Halaman seperti ini banyak sekali digunakan blogger untuk meningkatkan nilai Domain Authority (DA) dan Page Authority (PA) blog baru dengan cara redirect domain blog lama ke yang baru. Selain hal tersebut, masih banyak fungsi dari halaman error 404 ini yang sangat berguna untuk aktifitas blogging.

Bagi kalian yang belum mengetahui apa itu Halaman Error 404 (Not Found) dan juga fungsinya, silahkan simak penjelasan berikut ini.

Apa itu Halaman Error 404?

Pada dasarnya halaman ini akan muncul saat kalian sedang searching tetapi tidak menemukan halaman atau file yang diakses hilang bisa juga karena sudah dihapus, atau dirubah oleh penulisnya.


Halaman pesan error ini bisa berasal dari script situs atau mungkin faktor lain seperti dari server hosting tempat kalian menyimpan file website.

Fungsinya

Ada beberapa fungsi Halaman Pesan Error 404 yang sangat berguna bagi sebuah blog baru, diantaranya adalah sebagai berikut.
  1. Memberitahukan pengunjung jika ada halaman, atau file, yang sudah dirubah.
  2. Sebagai pesan pemberitahuan jika blog sedang dalam masa perbaikan.
  3. Sebagai pesan pemberitahuan bahwa blog sudah tidak dikelola kembali.
  4. Meningkatkan nilai Domain Authority (DA) dan Page Authority (PA) sebuah blog baru.

Cara Membuat Halaman Error 404

Sedangkan untuk membuatnya sendiri, kalian bisa pilih 2 cara yaitu langsung mengunduh file template atau mungkin ingin manual yaitu copy-paste kode.

Sebelum melanjutkan ke tutorial, pastikan terlebih dahulu kalian sudah backup template.


Tutorial Manual

  1. Login terlebih dahulu ke halaman Blogger.com
  2. Pada dashboard silahkan kalian pilih menu Template > Edit HTML
  3. Kemudian hapus semua kode yang ada, lalu ganti dengan kode berikut ini.
    <?xml version="1.0" encoding="UTF-8" ?>
    <html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
    <head>
      <meta charset="utf-8"/>
      <meta name="viewport" content="initial-scale=1, minimum-scale=1, width=device-width"/>
      <title>Error 404 (Not Found)!!1</title>
    <b:skin><![CDATA[
    
    /****CSS CODE*****/
    *{margin:0;padding:0}html,code{font:15px/22px arial,sans-serif}html{background:#fff;color:#222;padding:15px}body{margin:7% auto 0;max-width:390px;min-height:180px;padding:30px 0 15px}* > body{background:url(//www.google.com/images/errors/robot.png) 100% 5px no-repeat;padding-right:205px}p{margin:11px 0 22px;overflow:hidden}ins{color:#777;text-decoration:none}a img{border:0}@media screen and (max-width:772px){body{background:none;margin-top:0;max-width:none;padding-right:0}}#logo{background:url(//www.google.com/images/branding/googlelogo/1x/googlelogo_color_150x54dp.png) no-repeat;margin-left:-5px}@media only screen and (min-resolution:192dpi){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat 0% 0%/100% 100%;-moz-border-image:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) 0}}@media only screen and (-webkit-min-device-pixel-ratio:2){#logo{background:url(//www.google.com/images/branding/googlelogo/2x/googlelogo_color_150x54dp.png) no-repeat;-webkit-background-size:100% 100%}}#logo{display:inline-block;height:54px;width:150px}
    ]]></b:skin>
    </head>
    <body>
    <b:section class='hello' id='hello'/>
      <a href="https://www.google.com"><span id="logo" aria-label="Google"></span></a>
      <p><b>404.</b> <ins>That’s an error.</ins></p>
      <p>The requested URL <code>/</code> was not found on this server.  <ins>That’s all we know.</ins></p>
    </body>
    </html>
  4. Save Template dan lihat hasilnya.

Penutup

Mudah kan? tentu saja, hanya butuh waktu 1 menit untuk menerapkannya. Bagi anda yang mau request silahkan ajukan melalui kolom komentar atau bisa dari halaman kontak yang ada di blog ini.

Mungkin sekian dulu artikel dari Template Error 404 (Not Found) Seperti Milik Google, silahkan bagikan ke sosial media kalian jika dirasa bermanfaat.
Terima kasih

Baca juga

Posting Komentar