Cara Memasang Iklan In-feed Pada Blogspot Bawaan Versi Mobile


Iklan In-feed adalah salah satu jenis iklan adsense yang tampilannya unik menurut saya. Kemunculan iklan jenis ini biasanya berada di sela-sela daftar artikel seperti pada beranda blog. Tampilannya yang menyelinap di daftar artikel ini sepintas benar-benar mirip daftar artikel di halaman depan blog kita. Bagi anda yang mengaktifkan unit iklan auto ads, mungkin anda tidak perlu repot-repot memasang jenis iklan ini karena nanti akan diatur kemunculannya oleh google adsense. Namun bagi yang memasangnya secara manual, mungkin anda akan mengalami sedikit kesulitan karena harus mencari lokasi penempatan iklan pada menu edit html.

Mungkin ada banyak artikel yang membahas tentang cara memasang iklan in feed secara manual di template blog lewat menu edit html, namun kebanyakan tutorial yang ada hanya cara memasang pada template blog yang telah diatur untuk satu versi (versi web dan mobile disamakan). Sebagai pengguna yang masih setia pada template bawaan blogspot yang mengaktifkan dua tampilan berbeda antara versi web dan versi seluler, saya sendiri sempat kesulitan saat mencoba memasang iklan infeed ini agar muncul hanya di tampilan blog saya pada versi mobile. Hal ini karena kode-kode untuk versi web dan mobile pada template ada perbedaan sehingga penempatannya bisa saja berbeda.

Iklan infeed pada beranda blog

Dari hasil mengubak-ubek dan melewati berbagai percobaan yang saya lakukan, akhirnya ketemu juga cara agar iklan in feed bisa muncul pada tampilan beranda blog (bawaan standar) versi mobile. Caranya ternyata tidak dinyana sangat mudah. Jika anda hendak memasang jenis iklan in feed di blog anda pada versi mobile yang kebetulan memakai template bawaan blogspot, mungkin anda bisa mencoba langkah-langkah yang saya lakukan berikut ini. 

Cara Memasang Iklan In-feed Pada Blogspot Bawaan Versi Mobile

Sebelumnya pastikan anda sudah mendapat kode iklan in feed untuk dipasang blog anda. Caranya mudah, anda pasti bisa mengaktifkan dan mendapatkan kodenya pada menu ad units dan memilih jenis iklan in feed sesuai arahan yang tersedia dan disesuaikan dengan tampilan blog anda. Jika kode sudah didapat, sekarang kita tinggal memasangnya. Caranya yaitu:

1. Buka akun blogger anda

2. Pilih menu tema dan klik edit html

3. Cari kode <b:includable id='mobile-main' var='top'> dan temukan dibawahnya kode berikut ini:

<b:loop values='data:posts' var='post'> 

Jika sudah ketemu, tambahkan kode index='infeed' pada kode tersebut sehingga menjadi seperti berikut ini

<b:loop values='data:posts' var='post' index='infeed'

4. Langkah selanjutnya yaitu tinggal memasang kode iklannya. Jika pada tampilan web kita mesti mencari kode <div class='date-outer'> atau <div class='post-outer'> untuk meletakan kode iklan di bawahnya, ternyata pada versi mobile tidaklah demikian. Caranya yaitu cukup meletakannya setelah kode yang kita tambahkan tadi, yaitu kode <b:loop values='data:posts' var='post' index='infeed'> atau yang biasanya secara otomatis akan berubah menjadi <b:loop index='infeed' values='data:posts' var='post'>

Untuk pemasangan kode iklan in feed yang telah disesuaikan, gunakan kode di bawah ini:

<b:if cond='data:view.isMultipleItems'> <b:if cond='data:infeed == 2'> <div class='post'> <!-- Letakkan Kode Iklan InFeed anda Disini --> </div>
  </b:if>
</b:if>

Sehingga setelah diterapkan menjadi seperti berikut ini:

<b:includable id='mobile-main' var='top'><div class='blog-posts hfeed'><b:include data='top' name='status-message'/><b:if cond='data:blog.pageType == "index"'> <b:loop index='infeed' values='data:posts' var='post'>
<b:if cond='data:view.isMultipleItems'> <b:if cond='data:infeed == 2'> <div class='post'> <!-- Letakkan Kode Iklan InFeed anda Disini --> </div>
  </b:if>
</b:if>
------
------
------

Keterangan: angka 2 menunjukan bahwa iklan in-feed akan muncul setelah daftar judul artikel kedua. Anda bisa merubahnya sesuai keinginan anda. 

5. Jika sudah, silahkan simpan kembali template anda dan lihat hasilnya. 

Demikianlah Cara Memasang Iklan In-feed Pada Blogspot Bawaan Versi Mobile. Semoga bermanfaat. 

Labels: Blogging

Thanks for reading Cara Memasang Iklan In-feed Pada Blogspot Bawaan Versi Mobile. Please share...!

6 comments on Cara Memasang Iklan In-feed Pada Blogspot Bawaan Versi Mobile

  1. Kayaknya harus cari template yang tepat buat saya mas, terima kasih tutorialnya saya juga tertarik

    BalasHapus
  2. Coba dulu caranya, Bang. Terima kasih infonya.

    BalasHapus
  3. Bagaimana jika home page artikelnya berbentuk kotak? Setelah dipasang malah tidak rapi

    BalasHapus
    Balasan
    1. Kalau paham kode script, sebetulnya anda bisa membuat bingkai kotak untuk iklan tersebut agar tampak rapi seperti beranda artikel blog anda yang lain. Anda bisa memakai div style untuk membuat bingkai kotak berisi kode iklan tersebut. Kalau ingin empat pojoknya agak melengkung, anda juga bisa tambahkan pengaturan radiusnya sesuai selera.

      Hapus

Terima kasih telah berkunjung ke blog saya, silahkan berkomentar dengan sopan. Maaf, Komentar berisi Link Aktif, Promosi Produk Tertentu, J*di, P*rn*, Komentar berbau SARA dan Permusuhan, tidak akan dipublish.