Tuesday, January 1, 2019

Contoh Halaman 404 Yang Keren Serta Cara Memasangnya Di Blog

Contoh Halaman 404 Yang Keren Serta Cara Memasangnya Di Blog. Selamat Tahun Baru 2019 ya Sob... Semoga saya dan sobat semua banyak Rejekinya serta diberi kesehatan di Tahun ini, aamiin. Setelah vacum dan tidak pernah lagi menulis artikel di blog kesayangan ini, akhirnya di awal tahun 2019 saya coba lagi menulis, walaupun sebenarnya tulisan ini adalah sesuatu hal yang biasa saja, bagaimana tidak? lah.. barang cuma tutorial cara membuat halaman 404 yang notabene nya sudah ada pada setiap template hahahaaha.

Contoh  Halaman 404 Yang Keren Serta Cara Memasangnya Di Blog
Namun ga salah juga kalau sobat ingin merubah tampilan halaman 404 pada blog kesayangan sobat. Oh iya contoh halaman 404 ini saya temukan secara tidak sengaja sewaktu mencari player video untuk url Google Drive, nyasar ke blog yang namanya Ancokplayer, disanalah saya mendapatkan kode script dan html dari halaman 404 ini, sori ya Bro AncokNamhay kodenya saya bagikan disini hihihi.

Contoh  Halaman 404 Yang Keren Serta Cara Memasangnya Di Blog
Contoh  Halaman 404 Yang Keren Serta Cara Memasangnya Di Blog

Baiklah kita mulai ke tutorialnya, simpel saja silahkan sobat copy atau download codenya pada link download dibawah ini kemudian sobat copy lalu faste kan ke blog sobat sebelum tag penutup </body>

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
<iframe allow='accelerometer' frameborder='0' height='0' src='https://www.youtube.com/embed/y6Tqf_YOEvw?controls=0&amp;autoplay=1' width='0'/>
<style>*{margin:0;padding:0;border:0;font-size:100%;font: inherit;vertical-align: baseline;box-sizing: border-box;color: inherit;}body {background-image: linear-gradient(120deg, #000000 0%, #061a8c 100%);height: 100vh;}
h1 {font-size: 45vw;text-align: center;position: fixed;width: 100vw;z-index: 1;color:#ffffff26;text-shadow: 0 0 50px rgba(0, 0, 0, 0.07);top: 50%;transform: translateY(-50%);font-family: &quot;Montserrat&quot;, monospace;}
div {background: rgba(0, 0, 0, 0);width: 70vw;position: relative;top: 50%;transform: translateY(-50%);margin: 0 auto;padding: 30px 30px 10px;box-shadow: 0 0 150px -20px rgba(0, 0, 0, 0.5);z-index: 3;}
p{font-family: &quot;Share Tech Mono&quot;, monospace;color: #f5f5f5;margin: 0 0 20px;font-size: 17px;line-height: 1.2;}
span {color: #f0c674;}i {color: #8abeb7;}div a {text-decoration: none;color:#fff}b {color: #81a2be;}a.avatar {position: fixed;bottom: 15px;right: -100px;animation: slide 0.5s 4.5s forwards;display: block;z-index: 4}
a.avatar img {border-radius: 100%;width: 44px;border: 1px solid white;}@keyframes slide {from {right: -100px;transform: rotate(360deg);opacity: 0;}to{right:15px;transform: rotate(0deg);opacity: 1;}}</style>
<h1>404</h1>
<div><p>&gt; <span>ERROR CODE</span>: &quot;<i>HTTP 404 Not Found!</i>&quot;</p>
<p>&gt; <span>ERROR DESCRIPTION</span>: &quot;<i>This page does not exist, kalau bahasa Indonesianya kira-kira sudah ga ada lagi, entahlah masalahnya apa, bisa banyak faktor yang mempengaruhi :)</i>&quot;</p>
<p>&gt; <span>ERROR POSSIBLY CAUSED BY</span>: [<b>The link you clicked may be broken or the page may have been removed. Kenapa ga cari artikel lain saja yang masih ada hubungannya bro? atau kita mau NGOPI bareng nih hahaha...</b>...]</p>
<p>&gt; <span>GO BACK TO </span>: [<a href='/'>HOME PAGE</a>, <a href='https://www.antoncabon.us/p/about-me.html'>ABOUT US</a>, <a href='https://www.antoncabon.us/p/contact-me.html'>CONTACT US</a>...]</p><p> <span>SALAM SUKSES SELALU... :-)</span></p>
</div>
<a class='avatar' href='https://www.antoncabon.us' title='What are you looking for Sir?'><img alt='AntonCabon' src='https://lh3.googleusercontent.com/-fME0-Q7mHwk/AAAAAAAAAAI/AAAAAAAAIX0/v3Il4DGqRy4/s512-c/photo.jpg'/></a>
<script>
var str = document.getElementsByTagName(&#39;div&#39;)[0].innerHTML.toString();
var i = 0;
document.getElementsByTagName(&#39;div&#39;)[0].innerHTML = &quot;&quot;;

setTimeout(function() {
    var se = setInterval(function() {
        i++;
        document.getElementsByTagName(&#39;div&#39;)[0].innerHTML = str.slice(0, i) + &quot;|&quot;;
        if (i == str.length) {
            clearInterval(se);
            document.getElementsByTagName(&#39;div&#39;)[0].innerHTML = str;
        }
    }, 10);
},0);
</script>
  </b:if>

Selamat mencoba.

Alert message (Wajib !!!): "Simpan atau backup terlebih dahulu template sobat agar jika terjadi kesalahan dapat dengan mudah di restore kembali".


Demikianlah Tutorial mengenai Contoh Halaman 404 Yang Keren Serta Cara Memasangnya Di Blog, semoga ada manfaatnya ya, dan saya sangat senang jika sobat dapat berkomentar atau memberi masukan mengenai tutorial diatas.

Jika ada sobat Blogger yang ingin berdiskusi seputar Postingan ini atau Postingan tentang Dunia Kebun Sawit, silahkan tinggalkan komentar sobat di kolom komentar blog ini. saya akan sangat senang meresponnya, terimakasih salam Antoncabon.

"Hendaknya kesibukan kita lebih berfokus pada penyempurnaan penunaian kewajiban-kewajiban kita kepada Tuhan, sebab Dia, Tuhan yang sekaligus Pemberi Rejeki pasti akan membalas penunaian kewajiban tersebut dengan anugrah-Nya yang akan mencukupi kebutuhan kita." my fav words!

Related Posts

Loading...

0 komentar

TOP