Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger]

Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger] - Selamat datang di halaman kami 15HITS | Kumpulan Viral Paling Dicari, Pada postingan kali ini kita akan ulas Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger], Disini semua telah di siapkan khusus buat anda. Dalam postingan Gambar Blogger, yang sudah dibuat ini, bisa di ambil manfaatnya.

link : Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger]

Daftar Isi [Buka]

Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger] - Berkaitan dengan bulan Ramadhan (puasa), maka kita sebagai seorang blogger bisa memberikan nuansa baru bagi para pembaca/pengunjung blog kita.

Caranya yaitu dengan memasang Pop-Up ucapan selamat berpuasa, dimana Pop-Up ini akan muncul secara otomatis ketika pengunjung membuka situs blog kita.

Nah, dengan anda memasang Pop-Up ucapan selamat berpuasa ini, pastinya para pengunjung blog lebih merasa dihargai ibadah puasanya, khususnya untuk umat islam itu sendiri.

Baiklah, tanpa berlama-lama lagi, berikut adalah cara memasang notifikasi Pop-Up ucapan selamat berpuasa di situs blog:

1. Buka blogger.com
2. Masuk ke menu Tema>>Edit HTML
3. Letakkan kode berikut, sebelum </head>

<b:if cond='data:view.isHomepage'>
<style type='text/css'>
/* Pop Up Ramadhan */
@keyframes slideDown{0%{opacity:0;transform:translateY(-10%)}100%{opacity:1;transform:translateY(0%)}}
#toppuasa2019ku{line-height:1.55;display:block;background:#fff;position:fixed;top:25%;right:0;left:0;margin:auto;text-align:center;max-width:600px;box-shadow:0 0 2.5rem -1.5rem rgba(0,0,0,0.5);z-index:99;min-height:325px;padding:20px;border-radius:10px;animation:slideDown 2s}#toppuasa2019ku .puasa19{position:absolute;color:#222;font-size:1.5rem;font-weight:400;z-index:99999;text-align:center;margin:auto;padding:10px;left:0;right:0;top:17%;border-bottom:1px solid rgba(0,0,0,0.05);border-top:1px solid rgba(0,0,0,0.05)}#toppuasa2019ku .puasa19 p{margin:10px auto;font-style:italic;font-family:Georgia}#toppuasa2019ku .puasa19 .ramadhan2019{font-size:2.5rem;font-style:normal}#toppuasa2019ku a.close-popup{background:#428bca;position:absolute;bottom:20px;right:20px;color:#fff;text-align:center;cursor:pointer;z-index:99;border-radius:3px;display:inline-block;font-size:13px;padding:4px 14px;min-width:60px;border:1px solid #3885c7;transition:all 0.3s}#toppuasa2019ku a.close-popup:hover{background:#fff;color:#3885c7;border-color:#3885c7}#toppuasa2019ku a.close-popup:active{opacity:.9}
.ketupat{position:absolute;left:0;right:0;top:-12px;margin:auto;width:10px;height:10px;background:#B9E937;box-shadow:10px 0 0 #57D131,10px 10px 0 #B9E937,0px 10px 0 #57D131,5px 5px 0 10px #fff;display:inline-block;text-align:center;transform:rotate(45deg);z-index:2}.ketupat.duaa{top:initial;bottom:3px}
@media screen and (max-width:768px){#toppuasa2019ku .puasa19{font-size:1rem}#toppuasa2019ku .puasa19 .ramadhan2019{font-size:1.5rem}#toppuasa2019ku{min-height:260px;left:20px;right:20px}}
</style>
</b:if>

4. Dilanjutkan dengan meletakkan kode berikut, sebelum </body>

<b:if cond='data:view.isHomepage'>
<div id='toppuasa2019ku'>
<div class='ketupat'/>
<a class='close-popup' href='#' title='Close this message'>Close</a>
<div class='puasa19'>
   <p>Selamat Menunaikan Ibadah Puasa</p>
   <p><span class='ramadhan2019'>Ramadhan 1440 H</span></p>
   <p>Mohon Maaf Lahir Batin</p>
</div>
<div class='ketupat duaa'/>
</div>
<script type='text/javascript'>
//<![CDATA[
$(window).bind("load",function(){$("#toppuasa2019ku").animate({top:"25%"},1e3),$("a.close-popup").click(function(){return $(this).parent().fadeOut(1e3),!1})});
//]]>
</script>
</b:if>

5. Selesai

Penutup

Demikianlah tutorial singkat untuk memasang Pop-Up ucapan selamat berpuasa. Semoga saja setelah anda memasang Pop-Up ini, pengunjung blog anda akan semakin banyak nantinya.

Nah, mungkin itu saja yang dapat saya sampaikan pada kesempatan kali ini, kurang lebihnya mohon maaf. Terimakasih dan sampai jumpa di lain kesempatan.

Itulah Ulasan Kami Tentang Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger]

Sekianlah informasi tentang Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger] yang dapat kami bagikan, semoga dapat memberikan manfaat bagi anda.Teriakasih, jangan lupa share dan tuliskan komentar dibawah ini.

Anda sudah melihat postingan Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger] dengan alamat link https://15hits.blogspot.com/2019/05/cara-memasang-notifikasi-pop-up-ucapan.html silahkan di copy dan bagikan.