For world peace, liberate Al-Aqsa, eliminate Israel and anyone who is with Israel, they are the real terrorists
Bacakan

Cara membuat halaman Error 404 keren diblogger

Hello sobat IcloudZer kali ini admin akan memberikan informasi mengenai bagaiamana caranya membuat Halaman Error 404 Tampilan keren dan pastinya responsif di blogger, admin membagikan artikel ini karena tampilan dari halaman Error 404 kali ini benar-benar keren

Info: Oke jika kamunya sudah penasaran yuk langsung aja kita bahas bersama sama okay

Halaman Error

Halaman Error diblogger atau lebih dikenal dengan Halaman Error 404, yang mana halaman Erroe 404 berfungsi untuk menampilkan suatu informasi Error ketika pengguna salah dalam memasuki suatu halaman post diblogger

Info: Dalam kata lain jika halaman yang pengguna kunjungi tidak ditemukan maka Halaman Error 404 ini akan muncul

Halaman Error Default

Sebenarnya sih pada setiap template itu telah disediakan halaman Error 404, jadi untuk tampilan halaman Error 404 pada setiap template itu berbeda beda ya sobat

Info: So jika kamu ingin memasang halaman Error 404 Costum diblogger, kamu bisa menghapus kode HTML default dari Halaman Error 404nya okay

Cara Pembuatan

Baiklah sobat saatnya sekarang admin akan menjelaskan bagaiamana caranya membuat halaman Error 404, perhatikan setiap langkah yang admin berikan untuk memahaminya dengan benar okay

Kode CSS

Langkah pertama yang bisa kamu lakukan adalah menyalin kode CSS dibawah ini, kemudian letakkan diatas kode </head>

<style type='text/css'>
#outer-wrapper {display:none;}
#rah-error404{background:#f80000}#rah-error-text a{color:#fefefe}
#rah-error404 {text-align:center;margin-bottom:50px;font-weight:400;font-size:20px;position:fixed;width:100%;height:100%;line-height:1.5em;z-index:9999;}
#rah-error-text {top:30%;position:relative;font-size:20px;color:#eee;}
#rah-error-text a{background:#fff; padding: 10px; border-radius: 5px;}
#rah-error-text a:hover{color:#eee;}
#rah-error-text p {color:#eee;margin:50px 0 0 0;}
#rah-error-text span {position:relative;color:#fff;font-size:450%;padding:0 20px;border-radius:5px;font-weight:700;letter-spacing:3px;transition:all .5s}
#rah-error-text span:hover {color:#fff;-webkit-animation:jelly .5s;-moz-animation:jelly .5s;-ms-animation:jelly .5s;-o-animation:jelly .5s;animation:jelly .5s;}
@-webkit-keyframes jelly{
from,to{-webkit-transform:scale(1,1);transform:scale(1,1)}25%{-webkit-transform:scale(.9,1.1);transform:scale(.9,1.1)}50%{-webkit-transform:scale(1.1,.9);transform:scale(1.1,.9)}75%{-webkit-transform:scale(.95,1.05);transform:scale(.95,1.05)}}
@keyframes jelly{
from,to{-webkit-transform:scale(1, 1);transform:scale(1,1)}25%{-webkit-transform:scale(.9,1.1);transform:scale(.9,1.1)}50%{-webkit-transform:scale(1.1,.9);transform:scale(1.1,.9)}75%{-webkit-transform:scale(.95, 1.05);transform:scale(.95, 1.05)}}
@media only screen and (max-width:640px){
#rah-error-text span {font-size:200%;}
#rah-error-text a:hover {color:#fff;}}
</style>

Sebagai informasi: Kode CSS diatas berfungsi untuk membuat tampilan dari halaman Error 404nya okay

Kode HTML

Langkah selanjutnya yang bisa kamu lakukan adalah menyalin kode HTML berikut ini kemudian letakkan tepat dibawah kode </body>

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<div id='rah-error404'>
<div id='rah-error-text'>
  <span>(404) Page Not Found</span>
  <p><a class='back' href='/'><i class='fa fa-home'/> HOME</a>
</p>
  <br/>
<div id='mscontent'/>
  </div>
  </div>
  </b:if>
<div class='clear'/>

Sebagai informasi: Kode HTML Diatas berfungsi untuk menampilkan halaman Error 404 nya

Kode Javascript

Langkah selanjutnya adalah menyalin lagi kode javascript dibawah ini, kemudian kamu bisa meletakkan nya diatas atau sebelum kode </body>

<script type='text/javascript'>
//<![CDATA[
// Don't remove for Using this fitur
$(document).ready(function(){$('#mscontent').attr('style','display: inline-block !important;visibility: visible!important; opacity: 1!important; position: relative!important; z-index: 1!important; font-size: 13px!important; color: #fefefe!important').html('Created with <i style="color:#fefefe;-webkit-animation: icloudiceRing 5s 0s ease-in-out infinite; -webkit-transform-origin: 50% 4px; -moz-animation: icloudiceRing 6s 0s ease-in-out infinite; -moz-transform-origin: 50% 4px; animation: icloudiceRing 6s 0s ease-in-out infinite; transform-origin: 50% 4px;" class="fa fa-heart"></i> by <a href="https://icloudice.com" style="visibility: visible!important; opacity: 1!important; position: relative!important; z-index: 1!important; font-size: 13px!important; color: #333!important;font-weight: 500!important;">Icloudice</a>');setInterval(function(){if(!$('#mscontent:visible').length)window.location.href='https://icloudice.com'},3000)}); 
// Code not running if you remove the code
//]]>
</script>

Sebagai informasi: Kode javascript diatas untuk menyetabilkan performa halaman Error 404nya okay

Contoh Tampilan

Nah biar pada nggak penasaran, admin juga memberikan contoh tampilan dari halaman Error 404nya, contoh tampilan kamu bisa mengklik tombol dibawah okay

Info: Bagaiamana sobat IcloudZer dengan tampilan dari halaman Error 404nya keren bukan

Penjelasan Lanjutan

Okay sobat jika kamu sudah mengikuti langkah langkah diatas, maksudnya menyalin dan meletakkan kode dari Halaman Error 404nya, kemudian ketika kamu jalankan tidak tampil kamu bisa melakukan hal hal dibawah ini

  1. Hapus kode HTML default dari Error 404
  2. Jika tidak tampil juga kamu bisa menghapus seluruh kode default dari halaman Error 404, mulai dari CSS, HTML, dan sebagainya
  3. Untuk melihat tampilan Error nya kamu bisa menggunakan link seperti berikut ini
  4. https://blogkamu.com/p/icloudice

    Info: Kamu bisa mengubah saja alamat blog kamu tersebut

    (404) Page Not Found

    HOME


About the Author

Keindahanmu akan kuabadikan disetiap karyaku.

Post a Comment

Menghasilkan uang melalui survei berbayar
Best Viral Premium Blogger Templates from Icloudice


kami menawarkan berbagai template blogger dan produk istimewa untuk anda, support karya anak bangsa dengan membeli produk yang kami jual

Welcome to my store limited

  • Download theme blogger mirip xmlthemes

    Template mirip xmlthemes

    Template blogger terlaris nomor 1 di seluruh Indonesia bahkan di seluruh dunia lagi Diskon 50%
    Rp.153.000
  • Download theme blogger mirip xmlthemes

    Template mirip xmlthemes

    Template blogger terlaris nomor 1 di seluruh Indonesia bahkan di seluruh dunia lagi Diskon 50%
    Rp.153.000
  • Download theme blogger mirip xmlthemes

    Template mirip xmlthemes

    Template blogger terlaris nomor 1 di seluruh Indonesia bahkan di seluruh dunia lagi Diskon 50%
    Rp.153.000
  • Download theme blogger mirip xmlthemes

    Template mirip xmlthemes

    Template blogger terlaris nomor 1 di seluruh Indonesia bahkan di seluruh dunia lagi Diskon 50%
    Rp.153.000
  • Download theme blogger mirip xmlthemes

    Template mirip xmlthemes

    Template blogger terlaris nomor 1 di seluruh Indonesia bahkan di seluruh dunia lagi Diskon 50%
    Rp.153.000
  • Cookie Consent
    We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
    Oops!
    It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
    AdBlock Detected!
    We have detected that you are using adblocking plugin in your browser.
    The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
    Site is Blocked
    Sorry! This site is not available in your country.