Tag Conditional Blogger dan Cara Penggunaannya

Daftar Lengkap Tag Conditional Blogger dan Penggunaannya

Berikut ini daftar lengkap tag conditional blogger signifikan dan efisien untuk tujuan kustom: desain kustom dan kontrol kustom, beserta cara penggunaannya.
Sebelum menuju pada daftar lengkap tag conditional blogger dan cara menggunakannya, tahukah sobat apa itu tag conditional blogger?

Pernahkah sobat melarang kode AdSense untuk tampil pada halaman kontak (sejauh AdSense adalah untuk konten)? Atau, sobat hanya memerintahkan AdSense untuk tampil setelah posting pertama di halaman beranda saja?
wawasan lengkap tag conditional blogger

Atau mungkin sobat ingin mengaplikasikan perintah set kode CSS untuk beraplikasi pada halaman posting saja?

Pada praktiknya, tag conditional blogger diwakili oleh kode <b:if cond= ... sebagai pembuka dan ditutup oleh </b:if>. Tag ini bisa digunakan baik didalam <body> maupun <head>.

Fungsi dari tag conditional ini adalah untuk mengkondisikan satu set atau beberapa set kode supaya hanya beraplikasi pada halaman atau bagian tertentu. Kita mengetahui terdapat halaman beranda (homepage), item (posting), statis, label, arsip, kontak, 404 error, indeks (halaman pencarian: beranda, label dan arsip sekaligus), halaman label tertentu, dan halaman dengan Url spesifik.

Untuk bagian tertentu, tag conditional ini dapat mengkondisikan set kode supaya hanya beraplikasi pada posting pertama blogger. Tujuan penggunaan tag ini tentu tidak jauh dari fungsinya. Ini mungkin sangat dibutuhkan mengingat kaya-nya tujuan desain oleh para blogger.

Pada kesempatan ini, saya akan memberikan daftar semua tag conditional blogger beserta cara penggunaannya, mengkombinasikan tag conditional, dan apa-apa yang tidak bisa dilakukan dengan tag conditional.

Anatomi Tag Conditional Blogger
Sebelum menuju ke daftar, izinkan saya mengupas anatomi tag conditional dulu. Untuk beraplikasi secara utuh, tag conditional secara berurutan mengandung tag conditional pembuka, set perintah berupa kode html, javascript, atau CSS yang dikondisikan, dan tag conditional penutup.

Seperti inilah kerangka tag conditional lengkap bersama set kode perintah yang dikondisikan:

<b:if cond='kondisi-yang-diinginkan'> // pembuka tag conditional
Set kode yang dikondisikan // set kode yang dikondisikan
</b:if> // penutup tag conditional

Sedangkan, contoh aplikasi riil dari tag conditional blogger adalah seperti berikut (saya mengambil contoh tag conditional yang mengkondisikan perintah set kode CSS):

<b:if cond='data:blog.pageType == "item"'>
<style type='text/css'>
.post-header-line-1{text-align:center;}
</style>
</b:if>

Aplikasi tag conditional diatas artinya akan mengaplikasikan perintah berupa perataan kanan pada teks (text-align:center;) didalam elemen post-header-line-1 (yang dikondisikan) hanya pada halaman posting saja.
Bagaimana Tag Conditional Bekerja?
Sebelumnya, saya juga akan sedikit menjelaskan sedikit tentang cara kerja tag conditional blogger. Tag conditional dapat bekerja pada dua haluan perintah, yaitu perintah dan pencegahan. Namun, ada beberapa tag yang hanya efisien untuk bekerja pada satu haluan saja.

Pada perintah, tag conditional bekerja dengan mengkondisikan set kode untuk beraplikasi pada halaman atau bagian tertentu saja. Sedangkan pada pencegahan, tag conditional bekerja untuk mencegah set kode yang dikondisikan beraplikasi pada halaman atau bagian tertentu saja.

Untuk membuatnya bekerja, cukup masukan set kode didalam tag conditional (diapit b:if dan /b:if), seperti contoh pada anatomi tag conditional blogger diatas. Namun pada widget blogger yang ditambahkan melalui Add Gadget pada tab layout dasbor blogger, mungkin memiliki langkah yang agak berbeda, namun sebenarnya sama. Mengenai detail ini akan saya bahas di bagian penggunaan tag conditional blogger.

Jika perintah beraplikasi pada halaman atau bagian tertentu saja, maka masukan set kode kedalam tag conditional yang berisi perintah. Jika pencegahan beraplikasi pada halaman atau bagian tertentu saja, maka apit atau masukan set kode dengan tag conditional yang berisi pencegahan. Detailnya akan saya bahas di bagian daftar tag conditional lengkap.

Daftar Tag Conditional Lengkap
Selanjutnya, berikut ini daftar lengkap tag conditional blogger signifikan dan efisien untuk tujuan kustom: desain kustom, dan kontrol widget kustom, yang saya sortir menurut klasifikasi pengkondisian dengan perintah dan pengkondisian dengan pencegahan aplikasi set kode pada halaman tertentu, yang tercakup dalam klasifikasi pengkondisian per halaman dan perbagian:

Tag Conditional terkait Halaman Beranda
Pertama saya daftarkan tag conditional blogger terkait halaman beranda. Seperti yang telah disinggung diatas, tag conditional ini bekerja dalam dua haluan. Oleh karena itu, disini saya akan mendaftarkan tag conditional terkait homepage ini pada dua klasifikasi: perintah dan pelarangan.

Pertama perintah, tag dibawah ini akan mengkondisikan suatu set kode supaya hanya bekerja/tampil pada halaman beranda:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
set-kode
</b:if>

Sedangkan, kode berikut justru akan mencegah suatu set kode dari bekerja/tampil di halaman beranda; dengan kata lain, set kode yang diapit kode berikut akan bekerja/tampil pada halaman mana saja selain halaman beranda:
<b:if cond='data:blog.url != data:blog.homepageUrl'>
set-kode
</b:if>

Terkait Halaman Item/Posting
Kemudian, berikut ini tag conditional yang hanya akan memperkerjakan/menampilkan set kode pada halaman item/posting saja:
<b:if cond='data:blog.pageType == "item"'>
set-kode
</b:if>

Sebaliknya, tag conditional berikut akan mengkondisikan set kode untuk tampil dimana saja selain halaman item/posting:
<b:if cond='data:blog.pageType != "item"'>
set-kode
</b:if>

Terkait Halaman Indeks/Search (Beranda, Arsip, dan Label)
Memperkerjakan/menampilkan set kode di halaman indeks saja:
<b:if cond='data:blog.pageType == "index"'>
set-kode
</b:if>

Bekerja/tampil dimana saja selain halaman indeks:
<b:if cond=’data:blog.pageType != "index"’>
set-kode
</b:if>

Terkait Halaman Statis
Di halaman statis saja:
<b:if cond='data:blog.pageType == "static_page"'>
set-kode
</b:if>

Dimana saja selain halaman statis:
<b:if cond='data:blog.pageType != "static_page"'>
set-kode
</b:if>

Terkait Halaman Arsip
Tag conditional ini mungkin lebih cocok untuk kontrol meta tag. Di halaman arsip saja:
<b:if cond='data:blog.pageType == "archive"'>
set-kode
</b:if>

Dimana saja selain halaman arsip:
<b:if cond='data:blog.pageType != "archive"'>
set-kode
</b:if>

Terkait Halaman Label
Di halaman semua label saja (seperti url: http://mysecondlab.blogspot.com/search/label/cultural%20shock, apapun labelnya):
<b:if cond='data:blog.searchLabel'>
set-kode
</b:if>

Terkait Halaman Kontak
Dihalaman kontak:
<b:if cond='data:blog.url == "http://domain.blogspot.com/search/label/Contact_Us"'>
set-kode
</b:if>

Dimana saja selain halaman kontak:
<b:if cond='data:blog.url != "http://domain.blogspot.com/search/label/Contact_Us"'>
set-kode
</b:if>

Terkait Halaman Error 404
Di halaman error 404:
<b:if cond='data:blog.pageType == "error_page"'>
set-kode
</b:if>

Dimana saja selain halaman error 404:
<b:if cond='data:blog.pageType != "error_page"'>
set-kode
</b:if>

Terkait Halaman Kueri Pencarian
Di halaman kueri pencarian saja (seperti url: http://mysecondlab.blogspot.com/search?q= ...):
<b:if cond='data:blog.searchQuery'>
set-kode
</b:if>

Terkait Halaman Posting Khusus
Dihalaman posting/item individu tertentu saja:
<b:if cond='data:blog.url == "http://mysecondlab.blogspot.com/2014/11/dandang-gulo.html"'>
set-kode
</b:if>

Dimana saja selain halaman posting/item individu:
<b:if cond='data:blog.url != "http://mysecondlab.blogspot.com/2014/11/dandang-gulo.html"'>
set-kode
</b:if>

Terkait Halaman Khusus pada Situs Lainnya
Contoh halaman khusus lainnya pada situs adalah halaman pada daftar arsip khusus. Pada situs ini contoh URL-nya adalah: http://www.latuary.com/search/label/Archive_Page. Berikut ini untuk mengkondisikan suatu set kode hanya beraplikasi pada halaman ini:
<b:if cond='data:blog.url == "http://www.latuary.com/search/label/Archive_Page"'>
set-kode
</b:if>

Beraplikasi pada semua halaman selain halaman ini:
<b:if cond='data:blog.url != "http://www.latuary.com/search/label/Archive_Page"'>
set-kode
</b:if>

Terkait Bagian Posting Pertama Blogger
Dibawah posting pertama blogger:
<b:if cond='data:post.isFirstPost'>
set-kode
</b:if>

Sebenarnya masih banyak tag conditional blogger lainnya. Namun, tag-tag tersebut tidak begitu signifikan dan efisien untuk tujuan kustom, seperti desain kustom dan kontrol widget kustom. Oleh karena itu, saya tidak mengikutsertakan dalam pembahasan.

Sebagai listing saja, berikut ini tag conditional blogger yang tidak begitu signifikan dan efisien untuk tujuan kustom, seperti desain kustom dan kontrol widget kustom:

<b:if cond='data:post.numBacklinks != 0'>,
<b:if cond='data:post.commentSource == 1'>,
<b:if cond='data:post.allowComments'>,
<b:if cond='data:post.numComments == 0'>,
<b:if cond='data:post.commentPagingRequired'>,
<b:if cond='data:comment.authorUrl'>,
<b:if cond='data:comment.isDeleted'>,
<b:if cond='data:post.embedCommentForm'>,
<b:if cond='data:post.showBacklinks'>,
<b:if cond='data:feedLinks'>,
<b:if cond='data:post.feedLinks'>,
<b:if cond='data:post.allowIframeComments'>,
<b:if cond='data:post.embedCommentForm == &quot;false&quot;'>,
<b:if cond='data:post.dateHeader'>,
<b:if cond='data:post.thumbnailUrl'>,
<b:if cond='data:post.snippet'>,
<b:if cond='data:newerPageUrl'>,
<b:if cond='data:top.showStars'>,
<b:if cond='data:olderPageUrl'>,
<b:if cond='data:post.title'>,
<b:if cond='data:post.includeAd'>,
<b:if cond='data:post.link'>,
<b:if cond='data:top.showAuthor'>,
<b:if cond='data:post.authorProfileUrl'>,
<b:if cond='data:top.showTimestamp'>,
<b:if cond='data:post.url'>,
<b:if cond='data:top.showMobileShare'>,
<b:if cond='data:top.showDummy'>,
<b:if cond='data:mobileLinkUrl'>,
<b:if cond='data:blog.enabledCommentProfileImages'>,
<b:if cond='data:label.isLast != &quot;true&quot;'>,
<b:if cond='data:post.emailPostUrl'>,
<b:if cond='data:post.labels'>,
<b:if cond='data:post.editUrl'>,
<b:if cond='data:top.showEmailButton'>,
<b:if cond='data:top.showBlogThisButton'>,
<b:if cond='data:top.showTwitterButton'>,
<b:if cond='data:top.showFacebookButton'>,
<b:if cond='data:top.showOrkutButton'>,
<b:if cond='data:mobile'>,
<b:if cond='data:showCmtPopup'>,
<b:if cond='data:useImage'>, 
<b:if cond='data:imagePlacement == &quot;BEHIND&quot;'>,
<b:if cond='data:imagePlacement == &quot;BEFORE_DESCRIPTION&quot;'>,
<b:if cond='data:link.isCurrentPage'>,
<b:if cond='data:post.isDateStart'>,
<b:if cond='data:numPosts != 0'>,
<b:if cond='data:comment.favicon'>, dll.

Cara Menggunakan Tag Conditional Blogger
Basiknya, menggunakan tag conditional adalah dengan menggunakannya sebagai pengapit set kode yang dikondisikan. Misalnya adalah seperti pada contoh anatomi tag conditional blogger diatas.

Berikut ini contoh penggunaan tag conditional pada button sharing linkedin, yang mengkondisikan supaya button hanya tampil di halaman posting/item:
<b:if cond='data:blog.pageType == "item"'> // tag conditional pembuka
<script src='//platform.linkedin.com/in.js' type='text/javascript'>lang: en_US </script><script data-counter='top' expr:data-url='data:post.url' type='IN/Share'/>
<div style='clear: both;'/>
</b:if> // tag conditional penutup

Namun, untuk penggunaanya pada widget blogger yang ditambahkan melalui ‘Add Gadget’ pada tab ‘Layout’ dasbor blogger mungkin memiliki perlakuan yang sedikit berbeda. Berikut ini contoh penerapannya pada widget AdSense yang mencegah supaya tidak tampil di halaman statis (perhatikan kode yang dicetak biru):
<b:widget id='AdSense1' locked='false' title='' type='AdSense'>
<b:includable id='main'>
<b:if cond='data:blog.pageType != "static_page"'> // tag condtitional pembuka
<div class='widget-content'>
<b:if cond='data:blog.disableAdSenseWidget != "true"'>
<data:adCode/>
</b:if>
<b:include name='quickedit'/>
</div>
</b:if> // penutup
</b:includable>
</b:widget>

Apa yang perlu sobat lakukan adalah dengan memilih widget mana yang akan dikondisikan (bisa dicari dengan CTRL + F + <b:widget id), kemudian taruh tag conditional pembuka dibawah kode <b:includable id='main'> didalam widget tersebut, dan tutup dengan </b:if> diatas kode </b:includable> didalam widget tersebut.
Mengkombinasikan Tag Conditional
Sobat juga bisa mengkombinasikan dua atau lebih tag conditional. Dengan kata lain, sobat dapat mengkondisikan set kode dengan dua tag conditional atau lebih.

Misalnya, sobat ingin mencegah set kode untuk tampil di halaman statis dan error 404. Maka sobat hanya perlu mengapit set kode tersebut dengan dua tag conditional yang mencegah penampilan di halaman statis dann error 404, seperti berikut ini:
<b:if cond='data:blog.pageType != "static_page"'>
<b:if cond='data:blog.pageType != "error_page"'>
Set-kode
</b:if>
</b:if>
Atau, sobat ingin menampilkan widget featured post setelah posting pertama saja dan pada beranda saja. Maka sobat dapat mengapit set kode featured post tersebut seperti ini:
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<b:if cond='data:post.isFirstPost'>
set-kode-featured-post-disini
</b:if>
</b:if>

Apa yang Tidak Bisa Dilakukan Dengan Tag Conditional?
Yang perlu dicatat adalah, kombinasi ini dapat dilakukan mengikuti alur yang logis, tidak jauh dari kerangka fungsi beberapa tag conditional diatas. Oleh karena itu, ada beberapa kombinasi yang tidak dapat dilakukan. Contohnya adalah kombinasi seperti ini:
<b:if cond='data:blog.pageType == "static_page"'>
<b:if cond='data:blog.pageType == "item"'>
set-kode
</b:if>
</b:if>

Kode diatas tidak bisa bekerja, karena kontra. Pembuka tag conditional "<b:if cond='data:blog.pageType == "static_page"'>" hanya akan memperkerjakan/menampilkan set kode di halaman statis saja. Namun dengan berlawanan, dibubuhi lagi tag conditional "<b:if cond='data:blog.pageType == "item"'>" yang hanya memperkerjakan/menampilkan set kode di halaman posting saja. Ini tentu kontra, sehingga tidak bisa beraplikasi, yang justru membuatnya tidak beraplikasi pada semua halaman.

Semoga bermanfaat................

Kalau ada pertanyaan atau anda suka dengan "Tag Conditional Blogger dan Cara Penggunaannya" di atas silahkan masuk pada kolom komentar di bawah. Thanks.

'ngin

3 komentar

Kreasikan1 Desember 2016 pukul 14.40
yah lumayan paham lah dengan kode ini...
BalasHapus
Balasan
Belajar SEO14 Desember 2018 pukul 16.06
benar-benar komplit, ijin buat referensi untuk blog saya
BalasHapus
Balasan
Anonim17 Juli 2023 pukul 14.29
bbb
BalasHapus
Balasan

Tambahkan komentar

Sebelum Anda meninggalkan halaman ini, silahkan masukkan "KOMENTAR" Anda.

Timur Belambangan™

Tag Conditional Blogger dan Cara Penggunaannya

3 komentar

…

…

…