Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger] - Hallo sahabat Berbagi Tips Trik Apa Saja, Pada Artikel yang anda baca kali ini dengan judul Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger], kami telah mempersiapkan artikel ini dengan baik untuk anda baca dan ambil informasi didalamnya. mudah-mudahan isi postingan Artikel Blogger, yang kami tulis ini dapat anda pahami. baiklah, selamat membaca.

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

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

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.

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

Sekianlah artikel Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger] kali ini, mudah-mudahan bisa memberi manfaat untuk anda semua. baiklah, sampai jumpa di postingan artikel lainnya.

Anda sekarang membaca artikel Cara Memasang Notifikasi Pop Up Ucapan Selamat Berpuasa Di Blog [Blogger] dengan alamat link https://bangcombat.blogspot.com/2019/05/cara-memasang-notifikasi-pop-up-ucapan.html

Bagikan Artikel ini