Cara Memasang Iklan InFeed AdSense Di Antara Daftar Postingan Homepage Blogger

Cara membuat dan memasang unit iklan In-feed AdSense di antara daftar artikel utama di halaman depan Blogger. Disertai bagaimana cara memunculkan iklan infeed berulang setiap beberapa postingan sekali.
Cara Memasang Iklan InFeed AdSense Di Antara Daftar Postingan Homepage Blogger

Sesuai namanya, iklan InFeed (in feed) adalah jenis iklan yang akan tampil di dalam feed, atau lebih tepatnya di antara daftar artikel halaman depan Blogger. Unit iklan ini akan menyesuaikan ukuran dan bentuknya dengan template blog. In-feed hanya menampilkan iklan dengan kualitas elemen tinggi yang berarti tampilan visualnya lebih menarik dibanding jenis iklan lain.

Keuntungan memasang jenis iklan in-feed antara lain:
  1. Lebih user friendly karena penampilannya yang sama dan menyatu dengan template blog.
  2. Penempatan iklan yang unik yaitu di antara artikel di halaman utama menjadikannya menarik di mata pengunjung sehingga meningkatkan potensi klik.
  3. Sangat ideal untuk tampilan mobile karena dapat memaksimalkan ruang pada layar yang lebih kecil.
  4. Lebih leluasa untuk diedit dibanding jenis iklan biasa agar tampilannya bisa sesuai dengan layout blog.
  5. Menggunakan elemen iklan berkualitas tinggi sehingga tampilan visual lebih bagus.

Cara Buat Unik Iklan InFeed AdSense

1. Buatlah unit iklan InFeed baru. Caranya masuk ke dashboard akun AdSense » Ads » Ad units » klik tombol +New ad unit.
Pasang In-Feed Ads Google AdSense di Halaman Depan Blogger

2. Pilih tipe iklan In-feed ads.
Cara Membuat Jenis Iklan In Feed AdSense Untuk Blogspot

3. Pilih Create ad style manually agar lebih leluasa menentukan tampilannya. Lalu pilih jenis layout yang sesuai dengan template blog. Di bawah ini saya contohkan Image above. Lalu klik tombol Next.
Bagaimana Membuat Unit Iklan InFeed Adsense Di Halaman Utama Blog

4. Berikan nama untuk unit iklan dan lakukan pengaturan lain untuk mengubah penampilannya. Setelah itu klik tombol SAVE AND GET CODE.
Simpan Iklan InFeed AdSesene Diantara Artikel Blog

5. Setelah itu copy dan simpan kode yang muncul dan klik tombol I'M DONE.
Iklan In-feed Native Di Halaman Home Blog


Cara Pasang Iklan InFeed AdSense di Blogger

1. Setelah kode didapatkan, masuk ke dashboard akun Blogger dan buka menu Theme (Tema) » Edit HTML.

2. Cari kode <b:includable id='main' var='top'> dan temukan kode <b:loop values='data:posts' var='post'> di dalamnya. Contohnya seperti ini:
<b:includable id='main' var='top'>
  ....
  ....
  <b:loop values='data:posts' var='post'>
    ....
    ....
  </b:loop>
  ....
  ....
</b:includable>

3. Tambahkan index='infeed' di dalam <b:loop values='data:posts' var='post'> sehingga hasilnya seperti ini:
<b:loop values='data:posts' var='post' index='infeed'>


4. Lalu cari kode ini.
<div class='date-outer'>

OPSIONAL: kalau tidak ada gantilah cari kode ini.
<div class='post-outer'>
Kode setiap template biasanya berbeda. Pilih saja kode HTML yang merupakan class dari post utama di homepage.

5. Tambahkan kode berikut tepat di bawah kode yang ada di langkah sebelumnya.
<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>

a. Ganti <!-- Tulis Kode Iklan InFeed Disini --> dengan kode iklan infeed yang sudah dibuat di langkah awal.

b. data:infeed == 2 menentukan posisi iklan. Angka 2 artinya iklan akan muncul setelah postingan ke-2. Kamu bisa ganti sesuai keinginan.

6. Jangan lupa simpan template. Kode lengkap dari semua langkah di atas kurang lebih seperti ini.
<b:includable id='main' var='top'>
  ....
  ....
  <b:loop values='data:posts' var='post' index='infeed'>
    <div class='date-outer'>
      <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>
    </div>
  </b:loop>
  ....
  ....
</b:includable>


Menampilkan Iklan InFeed Berulang

Pada contoh di atas iklan InFeed akan muncul setelah postingan ke 2. Jika ingin membuat iklan muncul SETIAP 2 postingan sekali, ganti data:infeed == 2 menjadi data:infeed % 2 == 0 and data:infeed != 0.

Kode lengkapnya seperti ini.
<b:if cond='data:infeed % 2 == 0 and data:infeed != 0'>

Angka 2 bisa diganti sesuai keinginan. Jika diubah menjadi 3 artinya iklan muncul setiap 3 postingan, dan seterusnya.


Menampilkan Iklan InFeed Lebih Dari Satu Secara Manual

Cara ini membuat kamu bisa menentukan sendiri dimana iklan akan muncul. Kode HTML cukup ditulis dua kali atau lebih. Contohnya begini.
<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 cond='data:infeed == 5'>
  <div class='post'>
  <!-- Tulis Kode Iklan InFeed Disini -->
  </div>
  &lt;/div&gt; &lt;div class=&quot;date-outer&quot;&gt;
</b:if>

Artinya iklan infeed akan muncul setelah postingan ke-2 dan ke-5. Ganti angkanya sesuai keinginan. Dan jika ingin memunculkan lebih banyak tinggal tuliskan lagi kode HTMLnya.
47
Cara Memasang Iklan InFeed AdSense Di Antara Daftar Postingan Homepage Blogger
Cara Memasang Iklan InFeed AdSense Di Antara Daftar Postingan Homepage Blogger
Cara membuat dan memasang unit iklan In-feed AdSense di antara daftar artikel utama di halaman depan Blogger. Disertai bagaimana cara memunculkan iklan infeed berulang setiap beberapa postingan sekali.
Bagikan ke aplikasi lainnya:
  • WhatsApp
  • Telegram
  • Facebook
  • Twitter
  • Pinterest
  • LinkedIn

Artikel Terkait

47 komentar

  • Menulis kode gunakan <i>kode</i> (kode harus di-parse)
  • Menulis dalam syntax highlighter gunakan <em>kode panjang</em> (kode harus di-parse)
  • Menyisipkan gambar gunakan <strong>URL GAMBAR</strong> (ekstensi .jpg, .png, .gif, .webp, .ico)
  • Centang Beri Tahu Saya untuk mendapatkan notifikasi ke email saat ada yang membalas komentar.
  • One Piece Jpg
    22 Mei, 2023
    Profil: https://www.blogger.com/profile/12769616014514319167
    masih work om ? ane coba ko ga bisa yaaa
  • Admin
    08 Juni, 2021
    Profil: https://www.blogger.com/profile/02121727264246984006
    Mbak, di Template Textrim bisa kah ? saya edit belum muncul
  • wellbeingupp
    19 Mei, 2021
    Profil: https://www.blogger.com/profile/00549775137553849782
    kok ga ada ya di templat saya.. nama templat RAPID
    • wellbeingupp
      19 Mei, 2021
      Profil: https://www.blogger.com/profile/00549775137553849782
      kode post outer maupun data outer nya
  • Alfarisy
    23 Januari, 2021
    Profil: https://www.blogger.com/profile/08391684391817895757
    Terima Kasih banyak, ini artikel yang sangat saya cari
  • Dandy Dwi Putra Handho
    10 September, 2020
    Profil: https://www.blogger.com/profile/17652694451044666363
    mbak igniel sekali terima kasih terima kasih atas informasi yang diberi, sangat sangat membantu. Jazakillah mbakk
  • "HJ"
    24 Juli, 2020
    Profil: https://www.blogger.com/profile/00168260710137895757
    bang saya gak nemu includable main var top nya
  • "HJ"
    24 Juli, 2020
    Profil: https://www.blogger.com/profile/00168260710137895757
    kok saya gak nemu yah?
  • Andrie K
    14 Juni, 2020
    Profil: https://www.blogger.com/profile/15554953498022032552
    Kalo untuk blog layout V3 apakah bisa diletakkan kode ini mba ?
    • Igniel
      14 Juni, 2020
      Profil: https://www.blogger.com/profile/09199170379661896200
      Semua template yang dibuat blog Igniel sudah pakai layout v3 dan widget v2 terbaru.
      Pengujian di lakukan di template-template tersebut.
      Jadi, ya, bisa.
  • Eka Awaludin
    28 Januari, 2020
    Profil: https://www.blogger.com/profile/03027218065021816904
    Aku pake masonry, gimana pasang ads nya teh?
  • Led creatifity
    13 Januari, 2020
    Profil: https://www.blogger.com/profile/00997705542357672798
    Saya sudah coba memasukkan kode dan save kode html.. tetapi kok gk muncul ya pada feed?

    Saya cek lagi kodenya index='infeed' pasti selalu berubah pindah kedepan menjadi


    Saya edit kembali berulang ulang selalu kembali seperti itu setiap habis saya save.. apakah itu normal, atau ada cara lainnya?
  • Faishal Hady
    04 Januari, 2020
    Profil: https://www.blogger.com/profile/09068549300267389469
    Bisa untuk Igniplex juga kan? 😁
  • Unknown
    15 Desember, 2019
    Profil: https://www.blogger.com/profile/17163696379316304195
    Yang outer sama main var' top
  • Unknown
    15 Desember, 2019
    Profil: https://www.blogger.com/profile/17163696379316304195
    Di template fiksioner 2 kode dibawah ini tidak ada..


  • King Rockson
    04 Oktober, 2019
    Profil: https://www.blogger.com/profile/13121884235152613877
    This is not working on the igniplex template
  • Ilham
    17 September, 2019
    Profil: https://www.blogger.com/profile/12366262262941598280
    mantap
  • Anonim
    Anonim14 September, 2019
    Sudah saya terapkan di blog saya gan, terima kasih sharingnya. Sangat bermanfaat.. Sukses ya gan...
  • Author
    13 September, 2019
    Profil: https://www.blogger.com/profile/02304928811602305939
    Kok punyaku malah muncul di post ya gan?
  • ArRahim
    12 September, 2019
    Profil: https://www.blogger.com/profile/18324895804097516935
    mantap mbak... sy cb langsung jd tanpa ada yg eror dlu..
  • Karlina
    06 September, 2019
    Profil: https://www.blogger.com/profile/09112368890672057648
    Ini cara terlengkapnya :)
    Sudah saya praktekkan dan tinggal menunggu beberapa menit untuk melihat hasilnya

    Terimakasih :)
  • Fukuro
    23 Agustus, 2019
    Profil: https://www.blogger.com/profile/00321900115914476225
    Wow thanks tapi rumit banget yah newbee nh
  • Admin
    28 Juli, 2019
    Profil: https://www.blogger.com/profile/18296305630197594280
    kalo bikin iiklan kaya di blog ini gmna kak? ada di antara artikel terkait di bawah postingan
    • Igniel
      28 Juli, 2019
      Profil: https://www.blogger.com/profile/09199170379661896200
      Itu namanya iklan matched content. Tinggal ambil kodenya di dashboard adsense.
    • Admin
      28 Juli, 2019
      Profil: https://www.blogger.com/profile/18296305630197594280
      pasang kode iklan nya dmna kak?
    • Igniel
      19 Agustus, 2019
      Profil: https://www.blogger.com/profile/09199170379661896200
      Dimana aja boleh sesuai posisi yang diinginkan.
  • Deny ayong
    15 Juli, 2019
    Profil: https://www.blogger.com/profile/12802647287533525100
    Terima kasih banyak, saya masih belajar taruh iklan adsense yang tepat
  • FLIWET BAND
    08 Juli, 2019
    Profil: https://www.blogger.com/profile/03133792644905914123
    Mohon minta tutorialnya pemasangan iklan in feed seperti di blog mbak ignie , soalnya tutorial diatas munculnya gak sama , sama dg iklan mbak ignie, mohon pencerahannya trima kasih
    • Igniel
      13 Juli, 2019
      Profil: https://www.blogger.com/profile/09199170379661896200
      Sama aja.
    • FLIWET BAND
      15 Juli, 2019
      Profil: https://www.blogger.com/profile/03133792644905914123
      Saya ingin iklan yg mbak pasang tidak mengikuti grid,gimana caranya mbak mohon pencerahanya ,persis seperti iklan in feed yg mbak pasang?terima kasih
    • FLIWET BAND
      25 Juli, 2019
      Profil: https://www.blogger.com/profile/03133792644905914123
      Jawab mbak, tolong tutorialnya
  • MARGA TOMSIO
    05 Juli, 2019
    Profil: https://www.blogger.com/profile/11297297117227993994
    di tema blog saya tidak terdapat kode" seperti yang di sebutkan diatas! ada solusi kah
    • RezkoZ
      14 Maret, 2020
      Profil: https://www.blogger.com/profile/05975132582767146875
      semua lengkap di blog mas sugeg
  • Unknown
    19 Juni, 2019
    Profil: https://www.blogger.com/profile/03109727673059582751
    kode iklan apa perlu di parse?
  • Eva
    22 Mei, 2019
    Profil: https://www.blogger.com/profile/08710122825565061932
    nice shering gan, salam bw

    langsung uncul tuh iklanya, hehe
  • Junandacilegon
    20 Mei, 2019
    Profil: https://www.blogger.com/profile/14014282391048550922
    masih pemula saya mbbaa, seharian ngutak katik kode lumayan mubeng dan hente ketemu pisan, hihihihihi..
  • Innovanto
    18 Mei, 2019
    Profil: https://www.blogger.com/profile/12630806502897381574
    kak igniel kok ini gx bekerja ya untuk template yang menggunakan navigasi Load More, waktu di load iklannya gx muncul cuman muncul di bagian atas saja. tolong jawabannya ya kak igniel
    • Igniel
      18 Mei, 2019
      Profil: https://www.blogger.com/profile/09199170379661896200
      Iya bukan untuk navigasi dengan load more (tanpa reload)
    • Innovanto
      19 Mei, 2019
      Profil: https://www.blogger.com/profile/12630806502897381574
      Ko di tempat kak igniel bisa bekerja ya? Tutorialnya dong kak
  • Eva
    11 Mei, 2019
    Profil: https://www.blogger.com/profile/08710122825565061932
    mantap
  • Anonim
    Anonim27 April, 2019
    Di template contempo tag


    Kok ketemunya di widget arsip blog,bukan di widget blog post ya?

  • Blog Ala Santri
    13 Februari, 2019
    Profil: https://www.blogger.com/profile/05023123739597698190
    Apakah cara ini bisa diterapkan pada template igniplex?
  • HARIYANTO
    16 Januari, 2019
    Profil: https://www.blogger.com/profile/13722742873200601228
    Makasih gan infonya sukses selalu
  • Admin S.D.S
    19 Desember, 2018
    Profil: https://www.blogger.com/profile/14481153867761500014
    Mantap gan... thanks buat tutorialnya nya... visit balik gan
  • MementoMag
    06 Desember, 2018
    Profil: https://www.blogger.com/profile/01084920806793609063
    Mantap, berhasil di terapkan di blog saya. Makasih udah share mbak.