Cara Membuat Halaman 404 Error Not Found Pada Blogger | Cirebon-Cyber4rt - Mungkin dari kalian pernah menjumpai sebuah blog dengan Halaman 404 Error Not Found yaitu halaman blog yang tidak ada konten/isinya. Hal itu dapat membuat pengujung tidak nyaman karena sesuatu yang dicari tidak ada.

Halaman 404 error Not Found
Halaman 404 error Not Found


Nah, kali ini saya akan share bagaimana agar halaman kosong tadi menjadi lebih menarik dengan menambahkan CSS, sehingga tampilan halaman not found tadi menjadi lebih fresh dan ditambah dengan link menuju Halaman Utama atau Hompage blog sehingga pengunjung tidak akan langsung pergi. Berikut caranya :

Cara Membuat Halaman 404 Error Not Found Pada Blogger :
1). Login ke Blogger
2). Pilih menu Template kemudian pilih Edit HTML
3). Masukkan kode Meta Tag berikut tepat dibawah kode <head>

<b:if cond='data:blog.pageType == &quot;index&quot;'>
    <title><data:blog.pageTitle/></title>
<b:else/>
    <b:if cond='data:blog.pageType == &quot;error_page&quot;'>
        <title>404: Page Not Found - <data:blog.title/></title>
    <b:else/>
        <title><data:blog.pageName/> - <data:blog.title/></title>
    </b:if>
</b:if> 

4). Lalu letakkan kode CSS berikut tepat diatas kode ]]></b:skin> atau </style>

/* PAGE NOT FOUND */
#error-page {
  background-color:#000;
  position:fixed !important;
  position:absolute;
  text-align:center;
  top:0;
  right:0;
  bottom:0;
  left:0;
  z-index:99999;
}
#error-inner {
  margin:6% auto;
}
#error-inner .box-404 {
  width:200px;
  height:200px;
  background:#080;
  color:#fff;
  font-size:80px;
  line-height:200px;
  border-radius:10px;
  margin:0 auto 50px;
  position:relative;
}
#error-inner .box-404::after {
  content:&quot;
  &quot;
  ;
  width:0;
  height:0;
  bottom:-8px;
  border-color:#21afa4 transparent transparent;
  border-style:solid;
  border-width:9px 9px 0;
  position:absolute;
  left:47%;
}
#error-inner h1 {
  text-transform:uppercase;
}
#error-inner p {
  line-height:1.8em;
  font-size:15px;
}

5). Terakhir letakkan kode berikut tepat diatas kode </body>

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
        <div id='error-page'>
          <div id='error-inner'>
            <div class='box-404'>404</div>
           <h1>Halaman tidak ditemukan</h1>
            <p>Kemungkinan halaman telah dihapus, atau Anda salah menulis URL</p>
            <p>Kembali ke <a expr:href='data:blog.homepageUrl'><data:blog.title/></a></p>
          </div>
        </div>
    </b:if> 

6). Kemudian Simpan Template.

Silakan kalian kreasikan sendiri warnanya background, ukuran font dan lainnya. Sekian postingan saya kali ini tentang Cara Membuat Halaman 404 Error Not Found Pada Blogger, semoga dapat bermanfaat.