 |
| Cara Membuat Pop Up Banner Untuk Iklan di Blog |
Publikasi iklan yang muncul dalam bentuk banner umumnya digunakan untuk menyambut pengunjung untuk mengunjungi halaman website / blog. Tapi kadang-kadang ada juga orang-orang yang meninggalkannya karena mereka ingin mengumumkan sesuatu yang banner yang muncul dapat menarik perhatian para pengunjung.
Pada beberapa website yang saya telah mengunjungi iklan yang muncul sudah digunakan, terutama ketika memberikan ini Slot AD dari jendela pop-up, juga dapat membantu meningkatkan pendapatan kami. Jadi dari pada yang baik kesempatan ini saya ingin berbagi tentang bagaimana membuat banner yang muncul untuk iklan di blog.
Anda dapat memeriksa pengumuman Banner Pop-Up yang saya dipasang di blog ini, sangat hati-hati kan? Karena pengumuman yang muncul saya diinstal muncul beberapa detik setelah pengunjung membuka halaman blog ini, sehingga penampilan pengumuman yang muncul ini tidak akan mengganggu pengunjung dan juga tujuan untuk klik lebih besar karena iklan ini akan muncul mengambang di Media website / blog.
Oh, ya, hanya informasi, tidak ada, setelah Anda menginstal atau menempatkan kode iklan AdSense Anda pada naskah AD bahwa saya akan berbagi karena tidak dianjurkan dan Anda dapat membahayakan akun Google AdSense Anda.
Berikut adalah cara untuk muncul bendera untuk beriklan di blog:
Langkah pertama Silakan masukkan halaman papan blog Anda
Pilih menu tematik => Edit HTML
Cari kode </ body> atau Anda dapat menggunakan Ctrl + F untuk muncul kolom pencarian
Tempatkan kode skrip di bawah kanan atas </ body>
<style>
.hide{display:none;visibility:hidden;}
.popbox{position:fixed;top:0;left:0;bottom:0;width:100%;z-index:1000000;}
.pop-content{width:600px;height:400px;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>
<div class='popbox hide' id='popbox'>
<div aria-label='Close' class='pop-overlay' onclick='document.getElementById("popbox").style.display="none";removeClassonBody();' role='button' tabindex='0'/>
<div class='pop-content'>
<a href='URL TUJUAN' rel='noopener noreferrer' target='_blank' title='box'>
<div class='popcontent'>
<img alt='banner' height='450' src='URL BANNER ' width='850'/>
</div>
</a>
<button aria-label='Close' class='popbox-close-button' onclick='document.getElementById("popbox").style.display="none";removeClassonBody();'>&times;</button>
</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>
- Kode (lebar: 600px; tinggi: 400px) adalah untuk menyesuaikan ukuran spanduk Anda, sesuaikan
- Untuk URL tujuan, Anda dapat menyelesaikan tautan tujuan Anda ketika pengunjung mengklik spanduk yang diinstal
- Untuk URL banner, lengkapi URL banner yang akan dipasang
- Yang terakhir adalah angka 5000, nomor ini adalah untuk mengkonfigurasi waktu iklan yang muncul setelah pengunjung membuka halaman SE / Blog Anda.
Nah, ini adalah bagaimana membuat spanduk/popup yang muncul untuk iklan popup di blog cukup mudah, bukan? Berlatihlah sendiri di blog Anda jika ada keluhan atau pertanyaan, biarkan komentar kolom ... Terima kasih telah mengunjungi Mas Subhan Blog ..
Comments
Post a Comment