Lengkap Tag Conditional di Blogger untuk blog AMP dan NON AMP

andrie.id – Lengkap Tag Conditional di Blogger Lengkap untuk Blog AMP dan NON AMP. Tag conditional adalah sebuah tag HTML (XHTML) yang hanya bisa digunakan pada platform blogger. Tag conditional ini biasa digunakan untuk menampilkan atau menyembunyikan widget pada halaman tertentu.

Secara umum tag conditional gambarannya seperti dibawah ini:

<b:if cond='syarat_kondisi'>
<!-- kode perintah -->
</b:if>

KETERANGAN:

• syarat_kondisi, merupakan sebuah kondisi. Misalnya saat pengunjung mengakses halaman homepage maka …
• kode perintah, merupakan sebuah perintah. Misalnya saat pengunjung mengakses halaman homepage maka (syarat_kondisi), maka Widget Popular Post disembunyikan

Homepage

Homepage merupakan halaman depan atau halaman utama sebuah blog/website. Biasanya saat pengunjung mengakses halaman pertama kali yang ditampilkan adalah halaman homepage ini. Biasa orang menyebutnya sebagai halaman beranda blognya.

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
kode perintah / widget
</b:if>

Tag Conditional Blogger versi baru:

<b:if cond='data:view.isHomepage'>
kode perintah / widget
</b:if>

Index

Halaman index merupakan halaman yang hanya menampilkan judul postingan, summary, atau ringkasan artikel. Beberapa diantaranya seperti archive, halaman label, halaman pencarian, dan halaman utama.

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.pageType == "index"'>
kode perintah / widget
</b:if>

Tag Conditional Blogger versi baru:

<b:if cond='data:view.isMultipleItems'>
kode perintah / widget
</b:if>

Item

Halaman item merupakan nama lain dari halaman postingan, yang sudah pasti akan menampilkan keseluruhan artikel baik teks, gambar, tabel, serta widget lain yang ditampilkan dihalaman item. Halaman ini berbeda dengan halaman index karena halaman index hanya menampilkan ringkasan saja.

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.pageType == "item"'>
kode perintah / widget
</b:if>

Tag Conditional Blogger versi baru:

<b:if cond='data:view.isPost'>
kode perintah / widget
</b:if>

Tag Conditional Blogger untuk halaman tertentu:

<b:if cond='data:blog.url == data:blog.canonicalHomepageUrl + "2020/03/contoh-halaman.html"'>
<!-- Konten hanya akan ditampilkan pada halaman artikel dengan url Blog www.domainmu.com/2020/03/contoh-halaman.html -->
</b:if>

Page

Halaman Post atau Page biasa disebut sebagai halaman statis, biasanya halaman ini digunakan untuk menerbitkan page khusus seperti about us, contact us, privacy policy, sitemap, disclaimer, dan lain sebagainya. Halaman ini tidak muncul sama seperti halaman item, ia akan muncul hanya saat alamat url-nya diakses.

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.pageType == "static_page"'>
kode perintah / widget
</b:if>

Tag Conditional Blogger versi baru:

<b:if cond='data:view.isPage'>
kode perintah / widget
</b:if>

Tag Conditional Blogger pada halaman statis tertentu:

<b:if cond='data:blog.url == data:blog.canonicalHomepageUrl + "p/contoh-halaman.html"'>
<!-- Konten hanya akan ditampilkan pada halaman artikel dengan url Blog www.domainmu/p/contoh-halaman.html -->
</b:if>

Label

Halaman label merupakan sebuah halaman yang menampilkan ringkasan postingan blog berdasarkan label yang diklik atau diakses. Misalnya di blog andrie.id terdapat label Teknologi, Sosial media, Tutorial Blog, Template Blog, Review, Adsense, dan lain sebagainya.

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.searchLabel'>
kode perintah / widget
</b:if>

Tag Conditional Blogger Versi Baru:

<b:if cond='data:view.isLabelSearch'>
kode perintah / widget
</b:if>

Search

Halaman pencarian merupakan halaman yang biasa kamu akses saat mencari konten atau artikel diblog yang kamu kunjungi. Untuk mencobanya kamu bisa melakukan pencarian pada kolom pencarian yang ada pada header blog ini.

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.searchQuery'>
kode perintah / widget
</b:if>

Tag Conditional Blogger versi baru:

<!-- Termasuk halaman pencarian label -->
<b:if cond='data:view.isSearch'>
kode perintah / widget
</b:if>

Archive

Halaman arsip merupakan halaman yang menampilkan arsip setiap bulan, setiap tahun semua kategori postingan. Jadi artikel yang muncul pada halaman arsip dikelompokkan berdasarkan bulan dan tahun artikel itu diterbitkan.

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.pageType == "archive"'>
kode perintah / widget
</b:if>

Tag Conditional Blogger versi baru:

<b:if cond='data:view.isArchive'>
kode perintah / widget
</b:if>

404

Halaman 404 merupakan halaman error bagi halaman yang tidak ditemukan, halaman tersebut error mungkin saja sedang dalam proses pembaharuan atau artikel yang dikunjungi telah dihapus.

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.pageType == "error_page"'>
kode perintah / widget
</b:if>

Tag Conditional Blogger versi baru:

<b:if cond='data:view.isError'>
kode perintah / widget
</b:if>

Preview

Halaman pratinjau merupakan sebuah halaman simulasi bagi penulis untuk melihat bagaimana tampilan atau gambaran jika artikel dipublikasikan. Halaman ini hanya bisa dilihat oleh pemilik blog atau penulis yang login kedalam blog yang ditulis.

Tag Conditional Blogger versi lama:

<!-- Belum ada -->

Tag Conditional Blogger versi baru:

<b:if cond='data:view.isPreview'>
kode perintah / widget
</b:if>

Post dan Page

Jika ingin menampilkan widget yang hanya muncul di halaman postingan dan halaman statis kamu bisa menggunakan tag conditional blogger dibawah ini. Contoh widget yang muncul dihalaman postingan dan halaman statis yaitu kolom komentar blog.

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.pageType in ["item", "static_page"]'>
kode perintah / widget
</b:if>

Tag Conditional Blogger versi baru:

<b:if cond='data:view.isSingleItem'>
kode perintah / widget
</b:if>

Mobile

Tag conditional untuk pengunjung jika mengakses blog melalui perangkat ponsel atau mobile.

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.isMobileRequest == &quot;false&quot;'>
<!-- kode perintah -->
</b:if>

<b:if cond='data:blog.isMobileRequest == &quot;true&quot;'>
<!-- kode perintah -->
</b:if>

Tag Conditional Blogger versi baru:

<b:if cond="data:blog.isMobile">
<!-- Konten hanya ditampilkan di situs seluler -->
</b:if>

Deklarasi NOT, AND, OR

1. NOT

Penggunaan deklarasi NOT merupakan sebuah kondisi dimana kita tidak ingin menampilkan atau ingin menyembunyikan widget tertentu pada tag conditional yang dipilih. Misalnya widget populer post ingin saya sembunyikan dihalaman beranda (homapage), maka tag conditional bloggernya ialah:

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.url != data:blog.homepageUrl'>
kode perintah / widget
</b:if>

Mengubah simbol != (disembunyikan) menjadi == (hanya ditampilkan)

Tag Conditional Blogger versi baru:

<b:if cond='!data:view.isHomepage'>
kode perintah / widget
</b:if>

2. AND

Agar tidak terlalu banyak tag conditional blogger, maka dibuatlah kode yang lebih praktis dan simple jika ingin menambahkan kondisi baru. Misalnya saya ingin menampilkan widget popular post hanya di halaman postingan dan halaman statis, maka tag conditional yang digunakan yaitu;

Tag Conditional Blogger versi lama:

<!-- belum ada -->

Tag Conditional Blogger versi baru:

<b:if cond='!data:view.isPost and data:view.isMultipleItems'>
kode perintah / widget
</b:if>

3. OR

Kita bisa menggunakan deklarasi OR untuk menggabungkan banyak syarat atau kondisi sekaligus. Beginilah contoh tag conditional yang digunakan.

Tag Conditional Blogger versi lama:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
kode perintah / widget
</b:if>
</b:if>
</b:if>

Tag Conditional Blogger versi baru:

<b:if cond='data:blog.pageType == "item" || data:blog.pageType == "static_page" || data:blog.url == data:blog.homepageUrl'>
kode perintah / widget
</b:if>

Bagaimana, lebih mudah dan praktis kan? Penggunaan tag conditional ini tidak hanya digunakan pada widget saja, halaman post atau statis atau bahkan sidebar post. Akan tetapi juga bisa diterapkan didalam kode CSS, javascript, dan fungsi lain. Demikian kode lengkap tag conditional di blogger baik untuk halaman AMP maupun NON AMP, semoga bermanfaat.