Cara Buat Eror Page 404 Animasi Matrik Rain Di Blog

WWW.RHM-FILES.BLOGSPOT.COM

 DEMO

Berikut Adalah Cara Bua Eror Page 404 Animasi Matrik Rain Di Blog langsung saja kita mulai :
Langkah-langkahnya :
1. Login ke akun Blogger soat
2. Pilih menu Template Edit HTML
3. Letakan Code di bawah ini tepat di atas </body>

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<script src='https://cdn.rawgit.com/Brando07/share/newbe/matrix-rain-seocips.js' type='text/javascript'/>
<div id='error-page'>
  <div id='error-inner'>
    <div class='box-404'>404</div>
    <h1>PAGE NOT FOUND</h1>
    <p>You are half way around the word, but OOPS you make the wrong turn,
let us lead you to the right way,</p>
    <p> return to our
      <a href='http://www.rhm-files.tk' title='HOME'>homepage</a> ?
    </p>
    <div id='search-box'>
      <form action='/search' id='cse-search-box' method='get'>
        <input id='search-text' name='q' onblur='if(this.value==&apos;&apos;)this.value=this.defaultValue;' onfocus='if(this.value==this.defaultValue)this.value=&apos;&apos;' type='text' value='' />
        <button id='search-button' type='submit' />
      </form>
    </div>
  </div>
</div>
<canvas id="c"></canvas>
<style>
/*Halaman 404 Seocips*/
canvas { display:block; z-index:8888888; }
body { background:#333; margin:0; padding:0; font-family:calibri; color:#ddd; }
#error-page {  position:fixed !important; position:absolute; text-align:center; top:0; right:0; bottom:0; left:0; z-index:8888889; text-shadow:0 3px 4px #000; }
#error-page a:link,#error-page a:visited,#error-page a:hover { text-decoration:none; color:#fff; font-weight:bold; }
#error-inner { margin:11% auto; }
#error-inner .box-404 { width:200px; height:200px; background:rgba(1,0,1,0.9); color:#ccc; font-size:80px; line-height:200px; border-radius:10px; margin:0 auto 50px; position:relative; z-index:9999; box-shadow:0 3px 4px #000; border:1px solid #333; text-shadow:0 3px 4px #000; }
#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; }
#search-box { position:relative; width:350px; margin:10px auto; }
#cse-search-box { height:30px; border-radius:5px; background-color:#fff; overflow:hidden; box-shadow:0 3px 4px #000; border:1px solid #333; }
#search-text { font-size:12px; color:#ddd; border-width:0; background:transparent; }
#search-box input[type=&quot; text&quot; ] { width:85%; padding:5px 20px 12px 0; color:#666; outline:none; }
#search-button { position:absolute; top:0; right:0; height:32px; width:20px; margin-top:10px; font-size:14px; color:#fff; text-align:center; line-height:0; border-width:0; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEik6WR37uPxdKxcsdAUvYDML1TFy2Jjguk5-iKgmbk8oy5cwpyOC7qLC8nyrvskyAnMv3DC6nVZfyd_lpGbNxsxqFlBaYgk1eiRMrFN7nxzo8xpYJLqg-26WrNIfUOcFZXOKVRB-L5xz_M/s200/search-c.png) no-repeat; cursor:pointer; }
#error-inner p { line-height:0.7em; font-size:15px; }
</style>
</b:if>

4. Ganti http://www.rhm-files.tk dengan link blogger sobat
5. Save Template