Wednesday 13 December 2017

Memasang Iklan Billboard 970x250 Dengan Tombol Show Hide Ad Untuk Non AMP HTML

Iklan Billboard 970x250

Setelah kemarin kita uji coba Meningkatkan CPC Adsense Menggunakan Billboard 970x250 Dengan Tombol Show Hide Ad Untuk AMP HTML dan mendapatkan respon serta tanggapan yang banyak dari anggota Grup Blogger baik yang di Indonesia maupun di Luar Negri. Ada banyak beragam tanggapan dari yang sukses memasangnya dengan mengikuti Step by step penerapannya dan sudah merasakan hasil yang baik untuk peningkatan CPC adsense. 

Ada juga beragam tanggapan yang lain dari anggota dan pengunjung setiap melalui inbox mail, yang tidak berhasil menerapkan kode script tersebut didalam blog yang dikelolanya, hal ini membuat rasa penasaran saya untuk mengetahui dan meminta link blog tersebut, dan ternyata Agan agan atau Mas Bro pengunjung blog dibalikseo ini tidak memperhatikan Judul dari postingan yang lalu Meningkatkan CPC Adsense Menggunakan Billboard 970x250 Dengan Tombol Show Hide Ad Untuk AMP HTML.

Nah di kesempatan kali ini saya akan berbagi dengan Materi yang sama namun cara yang berbeda khusus untuk Pemasangan Iklan Billboard 970x250 yang akan dipasang pada Blog Non AMP dan ini sekaligus untuk menjawab pertanyaan sebelumnya.

Bagaimana sobat penasaran dan mau mencobanya, mari kita simak pembahasannya Cara Memasang Iklan Billboard 970x250 Dengan Tombol Show Hide Ad Untuk Non AMP HTML.

Langkah Pertama
Silahkan salin kode CSS style berikut di atas kode </head>.

<b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;error_page&quot;'>
<style type='text/css'>
/* Top Banner */
.top_banner{margin:20px auto;padding:0 10px 20px;position:relative;width:100%;max-width:990px;height:auto;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
#close_topbanner,#open_topbanner{font-family:inherit;position:absolute;padding:0;bottom:0;background:0 0;border:none;cursor:pointer;color:#888;font-size:15px;font-weight:500;height:20px;line-height:20px;}
#close_topbanner{right:10px}
#open_topbanner{width:100px;text-align:center;right:50%;margin-right:-50px}
#close_topbanner:focus,#open_topbanner:focus{outline:0}
.adsenseresponsive{width:970px;height:250px;}
@media screen and (max-width:960px){
.top_banner{max-width:320px;}
.adsenseresponsive{width:300px;height:250px;}
}
</style>
</b:if>


Langkah Ke Dua
Silahkan salin kode HTML berikut di bawah kode <body>.

<b:if cond='data:blog.pageType != &quot;static_page&quot; and data:blog.pageType != &quot;error_page&quot;'>
<div class='top_banner'>
<div id='topbanner'>
<!-- Simpan Kode Iklan di Bawah ini -->
<ins class="adsbygoogle adsenseresponsive"
     style="display:block"
     data-ad-client="ca-pub-xxxxxxxxxxxxxx"
     data-ad-slot="xxxxxxxxxxx"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
  </div>
<button id='close_topbanner' onclick="document.getElementById('topbanner').style.display='none';close_topbanner.style.display='none';open_topbanner.style.display='block';" role='button' tabindex='0' title='Close'>Close Ad</button>
<button hidden='' id='open_topbanner' onclick="document.getElementById('topbanner').style.display='block';close_topbanner.style.display='block';open_topbanner.style.display='none';" role='button' tabindex='0' title='Open'>Open Ad</button>
  </div>
</b:if>

Perhatikan kode yang ditandai ca-pub-xxxxxxx silahkan sesuaikan, dan data-ad-slot='xxxxxxxxx' silahkan juga sesuaikan.

Perhatikan juga setiap langkah dan penerapan kodenya, jika sudah selesai silahkan SAVE. Semoga bermanfaat.


EmoticonEmoticon