Notifikasi Ad blocker ini sebenarnya dibuat oleh mas Adhy Suryadi (kompiajaib), namun kali ini saya bagikan kembali di blog antoncabon dalam tampilan edisi Hari Kemerdekaan, lah apa hubungannya Ad blocker dengan hari kemerdekaan bro?, ya ga ada hubungan sih hehehe.
Terus gimana dengan judul di atas? nah Karena 17 Agustus adalah hari Kemerdekaan Republik Indonesia, maka apa salahnya sebagai blogger mari kita terus kobarkan jiwa Patriotisme sebagai anak bangsa negeri ini.
Kalo pemeikiran saya, banyak cara yang bisa kita lakukan untuk tetap mengobarkan jiwa patriotisme tersebut (googling ajalah kalo masalah ini ya hahahaha).
Kita bahas cara memasangnya ajalah, yuk disimak baik-baik dan tunjukan kalau kita adalah blogger yang cinta Indonesia, maka gunakanlah produk-produk Indonesia wkwkwkwkwk.
Blogger
Javascript di bawah ini Tambahkan sebelum kode
Letakan kode HTML dibawah ini, posisinya atur aja yang penting ga keluar dari
Simpan Template
Demikianlah Tutorial mengenai Cara Membuat Notifikasi Ad Blocker Ala Hari Kemerdekaan, 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.
Terus gimana dengan judul di atas? nah Karena 17 Agustus adalah hari Kemerdekaan Republik Indonesia, maka apa salahnya sebagai blogger mari kita terus kobarkan jiwa Patriotisme sebagai anak bangsa negeri ini.
Kalo pemeikiran saya, banyak cara yang bisa kita lakukan untuk tetap mengobarkan jiwa patriotisme tersebut (googling ajalah kalo masalah ini ya hahahaha).
Kita bahas cara memasangnya ajalah, yuk disimak baik-baik dan tunjukan kalau kita adalah blogger yang cinta Indonesia, maka gunakanlah produk-produk Indonesia wkwkwkwkwk.
Cara Memasang Notifikasi Ad Blocker :
- Terlebih dahulu anda harus Cinta Tanah Air Indonesia (Wajib !).
- Kemudian setelah itu berdoalah buat bangsa ini!,
- Langkah selanjutnya adalah masuk ke dashboard Blogger milik anda.
- Masukan kode berikut ini.
Blogger > Template > Klik Edit HTML > Tambahkan CSS berikut sebelum kode ]]></b:skin>
atau </style>
CSS nya:
#keep-ads{background:rgba(0,0,0,.65);padding:0;position:fixed;bottom:0;opacity:0;height:auto;transition:all .6s cubic-bezier(.25,.8,.25,1);-webkit-transform:translateZ(0);transform:translateZ(0);backface-visibility:hidden;transition:all .2s ease-in-out,visibility 0s;transform-origin:bottom center;}
#keep-ads p span {font-family:fontawesome;font-size:5rem;}
@keyframes wobble{0%{transform:scale(0) rotate(-54deg) translatey(40px)}45%{transform:scale(1.1) rotate(20deg) translatey(0px)}60%{transform:scale(1) rotate(-15deg) translatey(0px)}77%{transform:scale(1) rotate(10deg) translatey(0px)}100%{transform:translatey(0)}}
#keep-ads p{margin:0}
#keep-ads a{color:#0bce00;}#keep-ads a:hover{color:#fb6a00;text-decoration:none}
#keep-ads.show{left:0;top:0;right:0;z-index:1000;pointer-events:auto;opacity:1;visibility:visible;transform:rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);animation:wobble .7s;opacity:1;}
.keep-adsme{background:#ffffff;color:#666;position:absolute;text-align:center;padding:0;margin:auto;top:30%;left:0;right:0;font-size:1.2rem;line-height:1.5;max-width:930px;box-shadow:0 0 50px rgba(0,0,0,0.25);transition:all .6s cubic-bezier(.25,.8,.25,1);overflow:hidden}
.keep-adsme:hover{box-shadow:0 0 20px rgba(0,0,0,0.15);}
.keep-adsme h4{background:#fb0c0c;color:#fff;padding:15px 25px;font-size:2.2rem;margin:0 auto;text-shadow:0 1px 0 #c7c8ca,0 2px 0 #b1b3b6,0 3px 0 #9d9fa2,0 4px 0 #8a8c8e,0 5px 0 #77787b,0 6px 0 #636466,0 7px 0 #4d4d4f,0 8px 7px #001135;}
.keep-me{border-top:1px solid rgba(255,255,255,0.1);padding:10px 30px 50px 30px}
.salam {text-align:left;padding:5px;margin:auto;font-family:Pacifico,serif;color:#666}
.close-keep-ads{position:absolute;top:0;left:0;color:#fff;font-size:24px;font-weight:700;cursor:pointer;width:24px;height:24px;line-height:24px;text-align:center}
 |
| Notifikasi Ad Blocker Edisi Hari Kemerdekaan |
Javascript di bawah ini Tambahkan sebelum kode </body>
<script type='text/javascript'>
//<![CDATA[
// Notifikasi Adblocker
function hidekeep(){document.getElementById("keep-ads").style.display="none"}setTimeout(function(){var e=document.getElementById("keep-ads"),t=document.querySelectorAll("ins.adsbygoogle");0===$(t).height()&&(e.className="show")},2e3);
//]]>
</script>
Letakan kode HTML dibawah ini, posisinya atur aja yang penting ga keluar dari <body>
<div id='keep-ads'>
<div class='keep-adsme'>
<p><h4>Merdeka Bung ! <i aria-hidden='true' class='fa fa-hand-peace-o'></i></h4></p>
<div class='keep-me'>
<!--<p><span><i aria-hidden='true' class='fa fa-exclamation-triangle'/></span></p>-->
<p>Nobody likes ADS, but Antoncabon is paid for using GOOGLE ADSENSE on www.antoncabon.us. If you like our free articles, please consider to disable your ad blocker..</p>
<p>This is <a href='https://www.antoncabon.us/p/how-to-whitelisting.html' target='_blank' title='Show me how'>how to whitelisting</a> this blog in your ad blocker</p>
<p>Thank you very much</p>
</div>
<div class='close-keep-ads' onclick='hidekeep()'>×</div>
<div class='salam'>
<p>Regards,</p>
<p>"Antoncabon"</p></div>
</div>
</div>Simpan Template
Demikianlah Tutorial mengenai Cara Membuat Notifikasi Ad Blocker Ala Hari Kemerdekaan, 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!
