Membuat Unit Iklan Billboard

  • Whatsapp
unit iklan billboard

Unit iklan Billboard ini berukuran 970 x 250 dan 300 x 250. Unit iklan bilboard ini diatur dengan media jquery agar responsive.

Misalnya jika membuka dengan Pc maka ukuran ini akan tampil dengan ukuran 970 x 250, sedangkan jika di buka dengan smartphone ukuran ini akan muncul dengan ukuran 300 x 250.

Muat Lebih

Nah, jika kamu tertarik ingin memsangnya silahkan simak tutorial berikut.

Membuat Unit Iklan Billboard

1. Buka Dasboard Blogger dan pilih Template> Edit HTML
2. Letakkan CSS di bawah ini 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;}
.adsenseresponsive{width:970px;height:250px;}
@media screen and (max-width:960px){
.top_banner{max-width:320px;}
.adsenseresponsive{width:300px;height:250px;}
}
</style>
</b:if>

3. Kemudian letakkan kode HTML di bawah ini di atas kode <body>

Baca: Memasang Iklan Adsense di Tengah Artikel


<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'>
<!-- Kode iklan simpan 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>
</b:if>

Note: Jika kode diatas di letakkan di atas kode <body> maka unit iklan akan muncul di atas Header.
Silahkan letakkan kode diatas sesuai keinginan misalnya letakkan di bawah menu navigasi.

4. Terakhir simpan template dan silahkan lihat hasilnya

Loading...

Pos terkait