Selasa, 08 Januari 2019

author photo
Hai sobat Danifin, Billboard merupakan jenis iklan AdSense yang mempunyai ukuran yang cukup besar, yaitu 970 x 250 px. Dia bisa membuat penghasilan publisher semakin banyak dikarenakan ukurannya yang cenderung lebih besar dibandingkan dengan slot iklan lain mampu menarik perhatian visitor, lha bayangin aja klo iklan bagus dan segede godzilla siapa sih yang ga mau ngeklik. Blog Danifin akan berbagi cara pasang iklan Billboard ukuran besar di blog agar earning AdSense kamu bisa sedikit bertambah.

KHUSUS BLOGGER / BLOGSPOT

1. Tambahkan Inline CSS

First thing first, tambahkan kode CSS berikut ke pengaturan HTML blog kamu. Simpan SEBELUM / DI ATAS ]]></b:skin> atau <style>.
.billboard {display:block; max-width:1000px; min-width:970px; width:100%; max-height:300px; min-height:250px; height:100%; text-align:center; margin:20px 0px; padding:0px}
@media screen and (max-width:969px){.billboard {min-width:728px; min-height:90px}}
@media screen and (max-width:727px){.billboard {min-width:336px; min-height:280px}}
@media screen and (max-width:335px){.billboard {min-width:300px; min-height:250px}}
@media screen and (max-width:299px){.billboard {min-width:250px}}
@media screen and (max-width:249px){.billboard {min-width:200px; min-height:200px}}

2. Edit Class AdSense

Fungsi edit ini adalah menambahkan class agar terhubung dengan gaya tampilan.
  1. Ambil kode AdSense masing-masing dan simpan dulu di notepad. Pilih jenis responsive saja. Misal kodenya kaya gini ya:
    <ins class="adsbygoogle"
         style="display:block"
         data-ad-client="ca-pub-xxxxxxxxxxx"
         data-ad-slot="xxxxxxxxxxx"
         data-ad-format="auto"></ins>
    <script>
    (adsbygoogle = window.adsbygoogle || []).push({});
    </script>

  2. Hapus inline CSS dan data-ad-format yang ada disana. Maksudnya yang style="display:block" dan data-ad-format="auto". Tambahkan class billboard yang tadi dibuat di langkah pertama. Sehingga kode akhirnya akan seperti ini.
    <ins class="adsbygoogle billboard"
         data-ad-client="ca-pub-xxxxxxxxxxx"
         data-ad-slot="xxxxxxxxxx"></ins>
    <script>
    (adsbygoogle = window.adsbygoogle || []).push({});
    </script>

3. Pasang Kode Iklan AdSense Billboard Di Blog

Sekarang saatnya menyimpan kode iklan yang sudah dimodifikasi tadi. Tambahkan dulu tag kondisional supaya iklan nggak bakal muncul di halaman statis, halaman pencarian, dan halaman error. Trus cari kode <div id='content-wrapper'> dan letakan kode berikut SESUDAH / DI BAWAHNYA.
<b:if cond='!data:view.isPage and !data:blog.searchQuery and !data:view.isError'>
<ins class="adsbygoogle billboard"
data-ad-client="ca-pub-xxxxxxxxxxx"
data-ad-slot="xxxxxxxxxx"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>
</b:if>

Jangan lupa simpan pengaturan dengan klik tombol Save theme

KHUSUS WORDPRESS

Sebenaranya sama saja seperti penerapan di blogger, tapi bedanya kode css kita masukkan di custom css theme.

1. Masuk wp-admin, lalu menuju customize (kustomisasi), pilih custom css
2. Masukkan kode CSSnya: 
.billboard {display:block; max-width:1000px; min-width:970px; width:100%; max-height:300px; min-height:250px; height:100%; text-align:center; margin:20px 0px; padding:0px}
@media screen and (max-width:969px){.billboard {min-width:728px; min-height:90px}}
@media screen and (max-width:727px){.billboard {min-width:336px; min-height:280px}}
@media screen and (max-width:335px){.billboard {min-width:300px; min-height:250px}}
@media screen and (max-width:299px){.billboard {min-width:250px}}
@media screen and (max-width:249px){.billboard {min-width:200px; min-height:200px}}
3. Publish.
4. Lalu menuju widget atau tempat/bagian yang ingin di beri ads, tambahkan kode adsense yang sudah ditambahkan classnya
<ins class="adsbygoogle billboard"
      data-ad-client="ca-pub-xxxxxxxxxxx"
      data-ad-slot="xxxxxxxxxx"></ins>
<script> (adsbygoogle = window.adsbygoogle || []).push({}); </script>
5. Lalu save

Penempatan iklannya nggak melulu mesti dibawah content-wrapper. Misal nih, kalau mau disimpen dibawah navigasi, cari dulu kode HTML navigasinya dan simpan script AdSense dibawahnya.

Oya, kode CSS diatas berfungsi agar tetap menampilkan iklan AdSense Billboard responsif yang rectangular ketika dibuka di device yang lebih kecil, misalnya tablet atau smartphone. Maksudnya, iklan nggak bakal tampil horizontal (lebar kesamping tapi nggak tinggi) atau vertikal (tinggi keatas tapi nggak lebar), namun tetap besar dari lebar dan tingginya. Semoga berhasil prakteknya.

This post have 0 komentar


EmoticonEmoticon

This Is The Newest Post
Previous article Previous Post