Beberapa contoh tag Conditional Blogger dan Fungsinya

Tag Kondisional atau Conditional Tag adalah tag yang digunakan untuk mengatur elemen-elemen tertentu yang berfungsi untuk menampilkan atau menyembunyikan elemen pada kondisi tertentu.

Kode tag kondisional selalu diawali dengan tag <b:if> dan ditutup dengan tag </b:if>. Setiap kode tag <b:if> memiliki atribut cond, dimana atribut cond ini memiliki berbagai jenis nilai yang berfungsi untuk menunjukan suatu kondisi. Kita ambil salah satu contoh tag conditional yang paling umum digunakan.

Dari contoh diatas kita lihat bahwa atribut cond memiliki nilai data:blog.url == data:blog.homepageUrl yang menunjukan kondisi yang diinginkan.

Kode data:blog.url adalah pernyataan untuk mewakili keadaan sebuah halaman URL, sedangkan kode data:blog.homepageUrl adalah perwakilan dari halaman homepage blog Anda.

Menampilkan Elemen Tertentu Menggunakan Tag Conditional

Kita ambil contoh dari kode diatas, misalnya saya ingin menampilkan sebuah objek hanya di halaman beranda atau homepage blog saja dan akan hilang atau tidak tampil pada halaman lainnya. Maka kode tag conditional yang digunakan adalah seperti dibawah ini.

<b:if cond='data:blog.url == data:blog.homepageUrl'>OBJEK</b:if>

Menyembunyikan Elemen Tertentu Menggunakan Tag Conditional

Kebalikan dari cara sebelumnya, misalnya saya ingin menghilangkan atau menyembunyikan sebuah objek pada halaman beranda atau homepage blog dan akan muncul atau tampil pada halaman lainnya. Maka kode tag conditional yang digunakan adalah seperti dibawah ini.

<b:if cond='data:blog.url != data:blog.homepageUrl'>OBJEK</b:if>

Perhatikan baik-baik kedua contoh diatas hanya memiliki perbedaan antara == dan !=. Dimana arti dari == adalah sama dengan atau menyetujui kondisi. Sedangkan != adalah tidak sama dengan atau tidak menyetujui kondisi. Cukup mudah bukan, untuk menampilkan atau menyembunyikan suatu elemen pada blog Anda hanya perlu mengetahui kondisi tag dan menggunakan kedua pembanding diatas untuk mengatur keadaan atau kondisi.

Cara Menerapkan Tag Conditional
Ada dua cara penerapan kode tag conditional, yang pertama yaitu dengan menerapkannya secara langsung pada sasaran atau objek tertentu, yang kedua yaitu dengan menerapkannya secara tidak langsung dengan memanfaatkan kemampuan CSS.

Penerapan Kondisi Secara Langsung
Penerapan tag conditional secara langsung ini sangat mudah, Anda cukup mengapit sebuah objek atau sasaran dengan tag conditional, contohnya seperti dibawah ini.

<b:if cond='data:blog.url == data:blog.homepageUrl'>
OBJEK
</b:if>

Artinya:
Jika keadaan halaman saat ini sama dengan URL halaman homepage, maka OBJEK akan ditampilkan atau difungsikan.

Penerapan Kondisi Secara Tidak Langsung
Penerapan tag conditional secara tidak langsung dapat dilakukan dengan cara mengapitkannya pada kode CSS selektor objek yang menjadi sasarannya. Untuk menghilangkan objek sasaran, kita gunakan deklarasi display:none pada bagian CSS seperti dibawah ini.

<b:if cond='data:blog.url != data:blog.homepageUrl'> 
<style type='text/css'> 
#obyek{display:none} 
</style> 
</b:if>

........................

<div id='obyek'>OBJEK</div>

Artinya:
Seluruh elemen yang memiliki ID obyek akan disembunyikan atau tidak akan ditampilkan apabila keadaan halaman saat ini tidak sama dengan URL halaman homepage.

Perlu Anda Ketahui:
- Dalam kode HTML untuk memanggil kode css selektor menggunakan atribut id atau class.
- Dalam kode CSS id ditandai dengan tanda pagar atau (hastag) sedangkan class ditandai dengan titik (dot).

Tag Conditional Halaman Homepage

Halaman homepage adalah halaman murni yang tidak memiliki cabang atau folder, contohnya seperti ini.

Tag conditionalnya seperti ini:

<b:if cond='data:blog.url == data:blog.homepageUrl'>
KODE OBJEK
</b:if>

Tag Conditional Halaman Item

Halaman item adalah tipe halaman yang akan selalu berakhir pada nama berkas atau folder, contohnya seperti ini.

Tag conditionalnya seperti ini:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
KODE OBJEK
</b:if>

Tag Conditional Halaman Arsip

Ciri khusus pada halaman arsip adalah halaman homepage yang diikuti oleh cabang URL tahun, bulan, dan tanggal, namun tidak sampai kepada nama berkas halaman item, ciri khusunya yaitu pada akhir URL memiliki cabang archive.html, contonya Seperti ini.

Tag conditionalnya seperti ini:

<b:if cond='data:blog.pageType == &quot;archive&quot;'>
KODE OBJEK
</b:if>

Tag Conditional Halaman Statis

Halaman statis adalah jenis halaman spesial dari blogger yang berakhir pada nama berkas dan tidak akan masuk dalam daftar arsip blog, contohnya seperti ini.

Tag conditionalnya seperti ini:

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
KODE OBJEK
</b:if>

Tag Conditional Halaman Kesalahan (Error Page)

Halaman kesalahan atau error page adalah halaman yang tidak ditemukan pada blog Anda, halaman ini ditandai dengan kode error 404 not found. Halaman ini disebabkan oleh penulisan URL yang salah atau bisa disebabkan karena item atau postingan yang Anda buat sudah dihapus.

Tag conditionalnya seperti ini:

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
KODE OBJEK
</b:if>

Itulah beberapa contoh tag conditional blogger dan fungsinya, kode tag kondisional diatas dapat Anda susuaikan dengan kebutuhan Anda.