Tutorial Pasang Iklan Adsense di Blog 100% Tayang

Pena-indigo.com - Beberapa hari yang lalu sudah kita ketahui tentang jenis-jenis iklan adsense yang seringkali kita temui. Nah, kali ini kita akan coba bahas bagaimana penempatan iklan-iklan tersebut agar ramah bagi pengunjung situs tetapi juga bernilai strategis bagi kita selaku pemilik blog. 

Secara garis besar, jenis iklan di bagi menjadi 2 jenis : 

1. Menurut Situs
2. Menurut Unit Iklan

Iklan Otomatis ini mempunyai kode script yang lebih ringkas, namun mempunyai efek yang cukup besar bagi penempatan iklan. Dengan hanya memasang satu kode iklan otomatis, kamu sudah tidak repot-repot lagi untuk memasangnya secara manual. Ia akan memilih tempat terbaik yang memungkinkannya menampilkan kode script menjadi unit iklan. Misalnya di header, bilah samping, tengah artikel atau dibawah postingan. 

Namun begitu, iklan otomatis juga ada kekurangannya. Karena sifatnya otomatis, ia tidak menetap pada satu tempat saja. Kadang di satu waktu menempati bilah samping kadang juga tidak nampak. 

Karena sifatnya yang otomatis pula, kita tidak bisa memastikan berapa unit iklan yang tayang dalam satu halaman blog. Berbeda dengan unit iklan yang dipasang secara manual, unit iklan manual akan tampil sesuai dengan jumlah slot yang kita pasangi kode script. 

Selanjutnya untuk jenis iklan otomatis sebenarnya ada satu lagi yaitu jenis iklan otomatis AMP (Accelerated Mobile Page). Iklan jenis ini dapat menyesuaikan tampilan blog pada perangkat mobile. Karena saat ini pengunjung website lebih banyak dari perangkat mobile, maka disarankan untuk anda memasangnya pada situs anda. 

Cara Pemasangan Unit Iklan Otomatis



Pada menu dashboard Adsense, kamu pilih My Ads/Iklan lalu pilih jenis iklan otomatis. Klik download untuk mendapatkan kode iklan dan copy/salin.

Sekarang anda masuk editing tema/template di menu utama blogger, lalu pilih edit HTML. Letakkan kode adsense tersebut tepat dibawah <head> atau bisa juga di atas kode <body/>. Jika sudah selesai simpan template. Anda bisa langsung cek blog/situs, apakah sudah tayang atau belum. Jika pemasangan sudah benar maka paling lama 30 menit baru bisa tayang.


Cara Pasang Iklan Adsense Manual

Saya katakan manual karena iklan unit ini hanya bisa menayangkan ditempat ia diletakkan. Anda bisa memasangnya di Header utama (bagian atas), bilang samping (kanan atau kiri), bawah postingan, dalam artikel atau dimanapun tempatnya sesuai keinginan anda.


Kamu bisa memilih salah satu dari beberapa jenis iklan di atas untuk dipasang dengan cara manual pada blog. 

Jenis iklan yang ditandai dengan icon berwarna biru sangat direkomendasikan untuk dipasang pada blog yang pengunjung utamanya berasal dari perangkat mobile. 

Setidaknya ada 5 jenis iklan yang dapat anda pasang melalui template HTML atau Widget.

- Iklan Display
- Iklan Infeed ( antara postingan )
- Iklan dalam artikel
- Iklan dengan konten yang sesuai
- Iklan Link

Lima jenis iklan di atas juga mempunyai keunggulan dan kekurangannya masing. Misalnya untuk jenis iklan link. Jenis iklan Link memang berpotensi mendapatkan klik yang cukup besar, tetapi pengalaman penulis, iklan jenis ini biasanya mempunyai nilai CPC yang lebih kecil. 

Sementara jenis iklan display kurang diminati oleh pengunjung untuk mengeklik nya, tapi biasanya ia mempunyai CPC yang lebih besar. Sangat bagus jika anda memasangnya pada bagian atas , di atas potingan di bawah menu navigasi. 

Semua jenis unit iklan tersebut bisa ditempatkan dimana saja dengan syarat tidak menutupi/mengganggu konten atau artikel sebagai inventaris paling berharga. 

Cara Pemasanagan

Karena semua hal ada caranya, pun begitu juga dengan penempatan unit iklan pada blog.  

- Masih di menu ads/iklan klik pada bagian jenis iklan yang akan anda pasang maka akan muncul halaman 


- Beri nama unit iklan sesuai keinginan
- Atur formatnya Responsive atau Tetap
- Atur bentuk iklan (persegi,horizontal atau vertikal)
- Jika kamu memilih format iklan tetap maka pilihan untuk mengatur ukuran dan warna bisa kamu setting secara manual
- Jika kamu pilih format Responsive maka cukup klik "Buat"
- Setelah itu akan diberikan code Java Script unit iklan kamu pilih HTML atau AMP

Memasang Unit Iklan di Template HTML

- Masuk ke Menu Edit HTML pengaturan Template blog, lalu letakkan di antara <body> dan </body> simpan
- Kamu bisa memasangnya 4-5 unit iklan klik simpan.

Memasang Adsense di bagian sisi kanan, kiri, atas atau bagian bawah blog

- Masuk ke Menu Layout/Tata Letak
- Jika belum tersedia Wigdet Konfigurasi HTML maka kamu dapat menambahkannya sendiri dengan cara Tambahkan Gadget lalu HTML/Javascript. Letakkan kode adsense dalam kotak yang tersedia dengan atau tidak ditambahi judul wigdet
 

Tambahkan juga pada bagian atas, bawah atau sebelah kiri sesuaikan dengan template dan keinginan anda. 

- Klik simpan perubahan tata letak, Lalu periksa apakah langsung tayang atau belum
- Tunggu paling lama hingga 30 menit

Widget HTML/Javascript ini juga bisa digunakan untuk memasang iklan dari penyedia periklanan selain Google Adsense.

Selain cara tersebut, ada cara lain untuk memasang iklan pada bagian widget. Caranya kamu tetap pada bagian Tata Letak Tambahkan Widget pilih Adsense dan Simpan. Dengan memasang widget ini, anda tidak perlu lagi menempelkan kode java script seperti tadi. 

Memasang Iklan Tengah Artikel

Selanjutnya kita akan memasang iklan tengah artikel. Ini juga sangat direkomendasikan untuk anda. Di samping berpotensi menambah penghasilan, iklan tengah artikel juga tidak membuat para pengunjung merasa terganggu karena penempatannya diatur sedemikian rupa.

Penempatan iklan tengah artikel sangat strategis jika diletakkan pada bagian tepat bawah judul postingan, tengah artikel atau pada bagian akhir artikel. Anda bisa memasangnya 3 atau 4 iklan dalam setiap artikel tergantung panjang pendeknya artikel tersebut. 

Cara Pemasangan

Sekarang kita akan belajar membuat iklan tengah artikel menggunakan Template Edit HTML. Anda masuk menu Tema pilih Edit HTML. 

  • Cari Kode <data:post.body/> , agar tidak terlalu sulit mencarinya, caranya dengan CTRL + F, lalu tulis di dalam kotak pencarian kode tersebut
  • Kode tersebut tidak hanya satu, biasanya ada 3 atau 4. Jika anda menemukan ada 4 kode maka pilih kode yang ketiga. Jika anda menemukan 3 kode maka pilih yang kedua.
  • Ganti kode tersebut dengan script dibawah ini.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='middleAds ads_middle' id='middleAds1'>
      <div style='clear:both;'>
        <!-- middle ads1, your AD code put below -->
      </div>
    </div>
    <div class='middleAds ads_middle2' id='middleAds2'>
      <div style='clear:both;'>
        <!-- middle ads2, your AD code put below -->
      </div>
    </div>
    <div class='middleAds ads_middle' id='middleAds3'>
      <div style='clear:both;'>
        <!-- middle ads3, your AD code put below -->
      </div>
    </div>
<div id='tgtPost'><data:post.body/></div>
<script type='text/javascript'>  function insertAfter(tbh,tgt) {
  var prt = tgt.parentNode;
  if (prt.lastChild == tgt) {prt.appendChild(tbh);}
  else {prt.insertBefore(tbh,tgt.nextSibling);}}
  var tgt = document.getElementById(&quot;tgtPost&quot;);
  var midAd1 = document.getElementById(&quot;middleAds1&quot;);

  var midAd2 = document.getElementById(&quot;middleAds2&quot;);
  var midAd3 = document.getElementById(&quot;middleAds3&quot;);
  var showAd1 = tgt.getElementsByTagName(&quot;br&quot;);
  var showAd2 = tgt.getElementsByTagName(&quot;p&gt;&quot;);
  var showAd3 = tgt.getElementsByTagName(&quot;p&gt;&quot;);
  if (showAd1.length &gt; 0) {insertAfter(midAd1,showAd1[3]);}
  if (showAd2.length &gt; 0) {insertAfter(midAd1,showAd2[3]);}
  if (showAd3.length &gt; 0) {insertAfter(midAd1,showAd3[3]);}
  if (showAd1.length &gt; 0) {insertAfter(midAd2,showAd1[8]);}
  if (showAd2.length &gt; 0) {insertAfter(midAd2,showAd2[8]);}
  if (showAd3.length &gt; 0) {insertAfter(midAd2,showAd3[8]);}
  if (showAd1.length &gt; 0) {insertAfter(midAd3,showAd1[13]);}
  if (showAd2.length &gt; 0) {insertAfter(midAd3,showAd2[13]);}
  if (showAd3.length &gt; 0) {insertAfter(midAd3,showAd3[13]);}
</script>
</b:if>

  • Tambahkan kode adsense tepat dibawah kode Middle ads 1 , middle 2 dan midle ads 3. 
  • Gunakan Format iklan yang berbeda di tiga unit itu, misalnya satu unit iklan responsiv, satu unit iklan kotak tetap 300 x 250 dan satu unit iklan jenis link
  • Simpan Template dan Selesai
Memasang Iklan Infeed (antara postingan)

Sekarang kita akan coba pasang iklan yang berada di antara postingan blog. Jika kamu berada pada halaman utama blog, kamu akan mendapati beberapa postingan yang baru di publish dan yang sudah lebih lama. 

Nah, sekarang kita akan coba menyisipkan iklan disana. begini langkah-langkahnya : 

Saya ambilkan Tiga contoh Template :

1. VioMagz


  • Masuk akun adsense untuk membuat iklan > Pilih Iklan Infeed > Salin Kode
  • Masuk ke Blogger > Tema > Edit HTML
  • Cari kode dibawah

       <data:defaultAdStart/>
       <b:loop values='data:posts' var='post'>
  • Ganti kode tersebut dengan 
      <data:defaultAdStart/>
      <b:loop values='data:posts' var='post' index='x'>


  • Selanjutnya cari kode (pilih yang terdekat dengan kode diatas)


     <div class='post-outer'>

  • Letakkan kode ini tepat dibawahnya 
     <b:if cond='data:blog.pageType == &quot;index&quot;'>
     <b:if cond='data:x==1'>
     <div class='post'>
      ...kode iklan in-feed di sini...
     </div>
     </b:if>
     <b:if cond='data:x==3'>
     <div class='post'>
     ...kode iklan in-feed di sini...
     </div>
     </b:if>
     </b:if>

  • Jangan lupa letakkan kode iklan infeed pada tempat yang sudah disediakan
  • Simpan Template
2. Igniel

  • Setalah masuk pada Tema > Edit HTML maka cari kode berikut
      <b:loop values='data:posts' var='post'>

  • Ubah atau cukup tambahi saja kode tersebut sehingga menjadi
      <b:loop values='data:posts' var='post' index='infeed'>

  • Cari kode berikut 
      <div class='date-outer'>
  • Letakkan kode tepat dibawahnya 
      <b:if cond='data:view.isMultipleItems'>
      <b:if cond='data:infeed == 2'>
      <div class='post'>
      <!-- Tulis Kode Iklan InFeed Disini -->
      </div>
      &lt;/div&gt; &lt;div class=&quot;date-outer&quot;&gt;
      </b:if>
      </b:if>
  • Masukkan kode iklan dan klik simpan template

Keterangan : data.x==x3' dan infeed==2' menerangkan bahwa iklan akan muncul disela-sela postingan ke tiga dan ke dua.

Tidak jauh berbeda jika anda menggunakan template dari mana, caranya hampir sama.

Jika itu terasa cukup ribet, kamu bisa melakukannya dengan mudah dan ini bisa dilakukan untuk jenis template manapun. 

Caranya kamu masuk ke Menu Tata Letak > lalu pilih pada bilah "Blog Post"



Kemudian centang/ceklist pada kotak yang ditandai, pilih posisi yang akan ditempati. Lihat ga,bar dibawah




Klik Simpan perubahan dan tunggu hingga iklannya benar-benar sudah tampil pada blog.


Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel