Cara Memasang Iklan Popup Ucapan Selamat Puasa Diblog

Cara menciptakan pop up banner responsive di blog - Selamat pagi teman blogger, biar anda dalam keadaan sehat semua. menghitung beberapa hari lagi, kita akan melaksakan kewajiban kita sebagai muslim adalah mengerjakan kiprah puasa dalam satu bulan penuh. bagi anda seorang blogger dan sedang mengelola blog tanpa hari libur, artikel ini cocok untuk anda untuk memperbagus tampilan blog anda dengan memasang pop up ucapan selamat ramadhan ketika blog anda final di load.

Memasang banner sangat bermanfaat untuk menghormati sesama muslim yang sedang mengerjakan puasa, di dalam banner tersebut anda dapat meletakkan link tujuan artikel dengan menulis wacana puasa, hal itu akan meningkatkan seo artikel anda.

Memasang Popup Selamat Ramdhan

1. Menu Tata Letak > Tambah Widget > HTML/Javascript.
2. Salin script di bawah ini, kemudian pastekan ke dalam widget dan save.

<!-- POPUP SELAMAT MENJALANKAN IBADAH PUASA SURYAPERO --> <style> .hide{display:none;visibility:hidden;} .popbox{position:fixed;top:0;left:0;bottom:0;width:100%;z-index:1000000;} .pop-content{width:850px;height:450px;display:block;position:absolute;top:50%;left:50%;margin:-225px 0 0 -425px;z-index:2;box-shadow:0 3px 20px 0 rgba(0,0,0,.5);}  .popcontent{width:100%;height:100%;display:block;background:#fff;border-radius:5px;overflow:hidden} .pop-overlay{position:absolute;top:0;left:0;bottom:0;width:100%;z-index:1;background:rgba(0,0,0,.7)} .popbox-close-button{position:absolute;width:28px;height:28px;line-height:28px;text-align:center;top:-14px;right:-14px;background-color:#fff;box-shadow:0 -1px 1px 0 rgba(0,0,0,.2);border:none;border-radius:50%;cursor:pointer;font-size:34px;font-weight:lighter;padding:0} .popcontent img{width:100%;height:100%;display:block} .flowbox{position:relative;overflow:hidden} @media screen and (max-width:840px){.pop-content{width:90%;height:auto;top:20%;margin:0 0 0 -45%} .popcontent img{height:auto} } </style><br />     <div class="popbox hide" id="popbox">      <div aria-label='Close' class="pop-overlay" onclick='document.getElementById("popbox").style.display="none";removeClassonBody();'/>      <div class="pop-content">        <a href="www.suryapero.com" target="_blank" rel="noopener noreferrer" title="Cara Memasang Iklan Popup Ucapan Selamat Puasa Diblog"><br />           <div class="popcontent">            <img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr8umB3npuMcm37mGcq1e8n6_WtJu3Lb2ZlF1XkZsYc6PLq7mdvkZ31o2F9sYThr_9F6ZHmOITuHdTjT0PyPTj7jFTOjafNlqoxOXuvbzZa7PC52lhgtIZx5d0pHh5lYHWw8CXGO-e5w/s1600/sambut-1-ramadhan-1440-h2019-marak-ucapan-marhaban-ya-ramadhan-apa-arti-sebenarnya-min.jpg" alt="Cara menciptakan pop up banner responsive di blog Cara Memasang Iklan Popup Ucapan Selamat Puasa Diblog" width="850" height="450"/><br />           </div>        </a><br />         <button aria-label='Close' class='popbox-close-button' onclick='document.getElementById("popbox").style.display="none";removeClassonBody();'>×</button><br />       </div>    </div><script> //<![CDATA[ setTimeout(function(){  document.getElementById('popbox').classList.remove('hide');  document.body.className+=" flowbox"  }, 5000); function removeClassonBody(){var element=document.body;element.className=element.className.replace(/\bflowbox\b/g,"")} //]]> </script></div>

Keterangan

Link Surya Pero, ganti dengan link tujuan ada atau gunakan link artikel.
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjr8umB3npuMcm37mGcq1e8n6_WtJu3Lb2ZlF1XkZsYc6PLq7mdvkZ31o2F9sYThr_9F6ZHmOITuHdTjT0PyPTj7jFTOjafNlqoxOXuvbzZa7PC52lhgtIZx5d0pHh5lYHWw8CXGO-e5w/s1600/sambut-1-ramadhan-1440-h2019-marak-ucapan-marhaban-ya-ramadhan-apa-arti-sebenarnya-min.jpg, ganti dengan link gambar anda sendiri.

Dengan cara gampang tersebut, anda sudah berhasil menciptakan dan memasang popup iklan di blog anda. biar bermanfaat untuk semua dan bantu aku memabagikan tutorial ini kepada teman anda.