Membuat iklan muncul sesuai dengan kategori posting

Trik

Trik ini masih menggunakan tag Conditional yang telah saya tulis sebelum untuk "Membuat tampilan template berbeda dengan tag Conditional" dalam setiap kategori, perbedaannya hanya syntax atau exsekusi yang di tujukan adalah sebuah element. dengan mengatur munculnya iklan sesuai kategori akan membuat pengunjung lebih mudah mlihat iklan anda terutama untuk template toko online.

Contoh seperti ini: Anda mempunyai beberapa iklan banner. Masing-masing iklan banner tersebut berbeda target pengunjungnya, misal iklan banner satu target pengunjungnya seputar ekonomi, iklan banner dua target pengunjungnya seputar politik maka iklan banner yang kesatu hanya ingin muncul pada kategori ekonomi, dan banner yang kedua ingin muncul hanya pada kategori politik.

Hal-hal yang dicontohkan diatas bisa sobat coba lakukan dengan kode if conditional category seperti di bawah ini:

<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.name == &quot;kategori satu&quot;'>
Kode iklan 1 yang diinginkan
<b:else/>
<b:if cond='data:label.name == &quot;kategori dua&quot;'>
Kode iklan 2 yang diinginkan
</b:if>
<b:else/>
<b:if cond='data:label.name == &quot;kategori tiga&quot;'>
Kode iklan 3 yang diinginkan
</b:if>
</b:if>
</b:loop>

Di atas adalah tag conditional yang memuat tiga contoh kategori yang masih kosong. kemudian simak contoh di bawah ini:

Contoh Pertama

Iklan google adsense hanya muncul pada saat kategori uang di kunjungi, selain kategori itu yang muncul adalah iklan tokobaguscom :

<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.name == &quot;uang&quot;'>
Kode iklan adsense yang ada
<b:else/>
Kode iklan tokobaguscom
</b:if>
</b:loop>

Contoh kedua

Iklan google adsense tidak ingin muncul khusus pada saat kategori blogger dikunjungi :

<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.name == &quot;blogger&quot;'>
<b:else/>
Kode iklan adsense yang ada
</b:if>
</b:loop>

Praktek sedikit untuk memperjelas trik ini:

Saya memiliki dua banner yang berbeda { lihat gambar di bawah }



Kemudian, saya ingin memunculkan banner pertama hanya pada kategori teknologi dan banner kedua pada kategori kuliner, maka kode tag conditional yang saya buat adalah:

untuk kode banner:

<a href='http://www.yuuhu.info/' title='gadget yuuhu'><img alt='gadget info' border='0' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEig2OogE2aJXpN4eaB3VaanP5uaYVNmSL21P6UHlwT4aXzmGxkgLy9yyQvdRR1ynEn9gXkWoU8eGCxEmcf9-Fa9lJl9Eg7mols8i3en0vDzF8jHtKOeJydpvjfnbjTyFNLVeW2Lr8ylDc8/s1600/gadget.png' /></a>

<a href='http://www.yuuhu.info/' title='Kuliner Yuuhu'><img alt='kuliner yuuhu' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnKNgAzaLI1deTFPyGFhGYPwA-14BrqnmvlF4K4N4F3mqZFUQKaQpQU-9SZmRtkOF2YLHOw-ABGp3op7Ni3sT8tLarLje-dRkTTwE0dCKqha9lYRQxlUPcMFA5hsopCZQm5AwW0JSVuVY/s1600/kuliner.png' /></a>

untuk kode tag conditionalnya seperti berikut:

<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.name == &quot;teknologi&quot;'>
<a href='http://www.yuuhu.info/' title='gadget yuuhu'><img alt='gadget info' border='0' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEig2OogE2aJXpN4eaB3VaanP5uaYVNmSL21P6UHlwT4aXzmGxkgLy9yyQvdRR1ynEn9gXkWoU8eGCxEmcf9-Fa9lJl9Eg7mols8i3en0vDzF8jHtKOeJydpvjfnbjTyFNLVeW2Lr8ylDc8/s1600/gadget.png' /></a>
<b:else/>
<b:if cond='data:label.name == &quot;kuliner&quot;'>
<a href='http://www.yuuhu.info/' title='Kuliner Yuuhu'><img alt='kuliner yuuhu' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnKNgAzaLI1deTFPyGFhGYPwA-14BrqnmvlF4K4N4F3mqZFUQKaQpQU-9SZmRtkOF2YLHOw-ABGp3op7Ni3sT8tLarLje-dRkTTwE0dCKqha9lYRQxlUPcMFA5hsopCZQm5AwW0JSVuVY/s1600/kuliner.png' /></a>
</b:if>
</b:if>
</b:loop>

Langkah selanjutnya adalah untuk menentukan iklan itu akan disimpan di element mana? Sebagai contoh iklan tersebut ingin ditempatkan diatas posting dan hanya muncul pada single post (di halaman depan tidak muncul), maka kode tag conditional yang sesuai adalah seperti berikut:

<b:if cond='data:blog.pageType == "item"'>
<p>
<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.name == &quot;teknologi&quot;'>
<a href='http://www.yuuhu.info/' title='gadget yuuhu'><img alt='gadget info' border='0' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEig2OogE2aJXpN4eaB3VaanP5uaYVNmSL21P6UHlwT4aXzmGxkgLy9yyQvdRR1ynEn9gXkWoU8eGCxEmcf9-Fa9lJl9Eg7mols8i3en0vDzF8jHtKOeJydpvjfnbjTyFNLVeW2Lr8ylDc8/s1600/gadget.png' /></a>
<b:else/>
<b:if cond='data:label.name == &quot;kuliner&quot;'>
<a href='http://www.yuuhu.info/' title='Kuliner Yuuhu'><img alt='kuliner yuuhu' border='0' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjnKNgAzaLI1deTFPyGFhGYPwA-14BrqnmvlF4K4N4F3mqZFUQKaQpQU-9SZmRtkOF2YLHOw-ABGp3op7Ni3sT8tLarLje-dRkTTwE0dCKqha9lYRQxlUPcMFA5hsopCZQm5AwW0JSVuVY/s1600/kuliner.png' /></a>
</b:if>
</b:if>
</b:loop>
</p>
</b:if>

Kode tersebut harus ditempatkan persis diatas kode <data:post.body/>.
Dan simpan. semoga berguna dan bermanfaat...

Artikel Terkait

  • Blogger Mengatur Jumlah Posting per Halaman Label
    Blogger secara default biasanya menampilkan 20 postingan per halaman Label (kategory). Jumlah ini dapat kita rubah sesuai dengan keinginan/kebutuhan kita. Berikut ini langkah untuk mengatur  jumlah postingan per halaman label (kategori): Note: Sebaiknya gunakan browser Mozilla Firefox, jangan lupa mem-backup template sebelum mengedit …
  • Membuat Related Post terbaru dengan gambar
    Di sini, saya akan memperkenalkan dua jenis tampilan related post thumbnail yaitu related post dengan gaya vertikal dan horisontal. related post ini berbeda dengan lainnya, ketka dalam satu label yang tidak memiliki posting lebih dari satu, maka akan secara otomatis akan menampilkan pesan tidak ada artikel terkait, juga memiliki kegunaan yang …
  • Syntax Highlighter sederhana
    Apa itu Syntax Highlighter? para blogger seringkali berbagi script atau potongan kode untuk pembaca atau siapapun yang membutuhkannya untuk pengembangan dan tampilan web atau blog. Kebanyakan menggunakan blockquote sebagai "bidang pembungkus" dari script atau potongan kode tersebut dan menandai dengan beberapa warna khusus sebagai indikator at…
  • Menampilkan profil di pencari google
    Masalah berbagi saya tidak punya lelah buat sobat, ini adalah trik baru untuk menyatakan bahwa sobat adalah penulis yang sah di mata mesin pencari google untuk artikel yang tercopas. maraknya copas hasil karya artikel dan tulisan blogger yang membuat bingung para pembaca dan cara menghadapinya, karena terkadang muncul dua hasil yang sama di m…
  • Rahasia muncul dan hilangnya widget di blogger
    Trik ini di gunakan untuk tujuan tertentu, menghilangkan atau memunculka widget sebagai mana mestinya atau lebih tepat fungsinya. misalkan di halaman depan blog ini sudah ada daftar posting update terbaru, jadi untuk widget recent post lebih cocok di munculkan hanya pada halaman posting saja. trik ini juga bisa di gunakan untuk membuat halaman…
  • Cara membuat navigasi Breadcrumbs
      Cara Membuat Breadcrumbs SEO Friendly 1. Masuk ke Blogger 2. Klik Template > Edit HTML > Lanjutkan 3. Centang Expand Template Widget 4. Cari kode ]]></b:skin> dan simpan kode ini diatasnya: .breadcrumbs{padding:0px 5px 5px 0;margin-bottom:20px;margin-top:0px;font-size:11px;color:#5B5B5B;border-bottom:1px dotted #bbb…

3 komentar

  1. mau nanyak gan...... kode yang anda berikan kog tidak cocok di template saya / error...
    apakah ada cara yang lain mengenai trik tersebut gan?
    mohon jawabannya

    BalasHapus
    Balasan
    1. errornya dima sob, kalo bisa kasih ssnya. biar saya lihat :)

      Hapus
Kode klik emo: :) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p

Link aktif dalam komentar akan terhapus secara otomatis.
Untuk menyisipkan kode, gunakan tag <i rel="code">...KODE ANDA DI SINI...</i>
Untuk menyisipkan script, gunakan <i rel="pre">...KODE SCRIPT ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">...URL GAMBAR ANDA ...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">...JUDUL ANDA...</b>
Untuk menyisipkan catatan, gunakan tag <b rel="quote">...CATATAN ANDA...</b>
Untuk menciptakan efek tebal gunakan tag <b>...TEKS ANDA...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>...TEKS ANDA...</i>

Konversi KodeOOT
:) :( =( :wa: :s ^_^ :D =D ^:D @@, ;) :-bd :-d :ya: :'( T_T :\ :p B) :Q :Ozz 7:( \o/ **p
Jika anda memiliki bahasan atau topik lain yang sama sekali tidak ada hubungan dengan tutorial diatas anda bisa menyampaikannya di halaman OOt. klik [link ini] untuk membuka halaman OOT.

Back to Top
Loading...