Iklan

Mengenal Tag Conditional dan Fungsinya di Blogspot

Baca Juga



Bagi template developer, fungsi tag conditional ini teramat penting karena mengatur penempatan widget yang akan tampil di halaman tertentu pada blogspot/blogger. Misalnya dengan mengatur widget popular post yang hanya dimunculkan di halaman posting atau homepage atau di halaman lainnya.

tag conditional pada blogspot

Pengaturan yang seperti ini, di blogspot hanya dimungkinkan dengan memanfaatkan kode tag conditional.
Sebenarnya, banyak versi tag conditional dalam pemrograman, namun khusus untuk blogspot ada beberapa jenis tag conditional yang bisa diterapkan pada templatenya.

Di sini Saya akan sedikit membahas, beberapa tag conditional yang sering dipakai jika melakukan editing template blogspot untuk mengatur tampilan dan desain layout template tersebut agar sesuai dengan keinginan pengedit atau pembuatnya.

Jadi secara garis besar, bisa disimpulkan bahwa fungsi tag conditional adalah untuk mengatur elemen-elemen tertentu, agar bisa tampil pada kondisi-kondisi tertentu pula.

Pada blogspot, tag conditional selalu diawali dengan kode tag <b:if> dan diakhiri atau ditutup dengan tag </b:if>. Pada setiap tag, selalu disematkan properti cond, yang fungsinya menunjukkan nilai dari suatu kondisi tertentu.

Baca juga : Template Gratis Simple dan untuk Adsense

Tag Conditional untuk Elemen Tertentu

Menampilkan dan menyembunyikan elemen hanya pada halaman homepage

Untuk menampilkan elemen tertentu hanya muncul di homepage dan tidak muncul di halaman lainnya, kode tag conditional yang digunakan adalah seperti ini.

<b:if cond='data:blog.url == data:blog.homepageUrl'>
kode object berupa HTML, CSS, dll.
</b:if>
Kode data:blog.homepageUrl menunjukkan halaman homepage dari blogspot Anda. Sebagai contoh, pada blog ini homepagenya adalah https://www.tukangtokoonline.web.id, sehingga elemen objek yang berada di dalam kode tag conditional di atas hanya akan tampil/muncul di url homepage https://www.tukangtokoonline.web.id.

Sedangkan untuk menyembunyikan elemen tertentu dari homepage blog Anda, maka kode tag conditional yang dipakai adalah seperti ini.

<b:if cond='data:blog.url != data:blog.homepageUrl'>
kode object berupa HTML, CSS, dll.
</b:if>

Perhatikan kode di atas, yang membedakannya hanya pada == dan !=. Pada tanda == artinya dibaca sama dengan, sedangkan tanda != dibaca sebagai tidak sama dengan atau tidak setuju dengan kondisi tertentu. Jadi sebenarnya tudak cukup sulit untuk memahami kode tag conditional ini.

Menampilkan dan menyembunyikan elemen hanya pada halaman item

Halaman item merupakan jenis halaman yang selalu berakhir pada nama berkas atau folder. Contoh halaman item pada blogspot, yang dimaksud adalah seperti pada url ini :

https://www.tukangtokoonline.web.id/2019/01/toko-online-blogspot-super-responsive-tukutoko-theme.html

Jika bermaksud memunculkan elemen tertentu hanya pada halaman posting, maka kode tag conditional yang dipakai adalah seperti ini.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
kode object berupa HTML, CSS, dll
</b:if>

Sedangkan sebaliknya, jika ingin menyembunyikan elemen tertentu pada halaman posting, maka kode tag conditional yang dipakai adalah berikut.

<b:if cond='data:blog.pageType != &quot;item&quot;'>
kode object berupa HTML, CSS, dll
</b:if>
Baca juga : Landing Page Blogspot Template untuk Bisnis Wisata, FREE Download!! 

Menampilkan dan menyembunyikan elemen hanya pada halaman statis (page)

Untuk menampilkan elemen tertentu hanya pada halaman statis. Contoh url halaman statis adalah seperti ini:

http://www.tukangtokoonline.web.id/p/contact.html

maka kode yang dipakai adalah seperti ini.

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
kode object berupa HTML, CSS, dll
</b:if>

sedangkan untuk menyembunyikan elemen tertentu di laman statis dipakai kode seperti ini.

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
kode object berupa HTML, CSS, dll
</b:if>

Menampilkan elemen pada index

Definisi secara sederhana mengenai halaman indeks adalah semua halaman yang bukan merupakan halaman item. Contohnya seperti ini.

http://www.tukangtokoonline.web.id
http://www.tukangtokoonline.web.id/p/contact.html
Kode tag conditional yang dipake adalah seperti ini.
<b:if cond='data:blog.pageType == &quot;index&quot;'>
kode object berupa HTML, CSS, dll
</b:if>

Menampilkan elemen pada Halaman Arsip

Halaman arsip ini pada url nya mengandung halaman homepage dan selalu diikuti dengan cabang url tahun tanggal dan bulan. Ciri khususnya pada halaman ini, pada url nya mengandung berkas archive.html. Contohnya adalah sebagai berikut.

https://www.tukangtokoonline.web.id/2018_01_12_archive.html
Sedangkan kode tag conditional yang dipakai adalah seperti ini.
<b:if cond='data:blog.pageType == &quot;archive&quot;'>
kode object berupa HTML, CSS, dll
</b:if>

Menampilkan elemen pada Halaman Label dan Label Tertenu

Tag Conditional yang dipakai untuk menampilkan elemen tertendu pada halaman label adalah sebagai berikut.

<b:if cond='data:blog.searchLabel'>
kode object berupa HTML, CSS, dll
</b:if>

Sedangkan supaya elemen hanya bisa tampil di halaman label tertentu, misalnya, hanya elemen tersebut hanya ingin ditampilkan pada label Blogger Template seperti ini.

https://www.tukangtokoonline.web.id/search/label/Blogger%20Templates
kode tag conditionalnya adalah seperti berikut ini.
<b:if cond='data:blog.searchLabel == &quot;Blogger%20Template&quot;'>
kode object berupa HTML, CSS, dll
</b:if>

Menampilkan elemen pada Halaman Pencarian  dan Pencarian Tertentu

Url halaman pencarian selalu diawali dengan search/?q dan diakhiri dengan kata kunci pencarian, contohnya adalah sebagai berikut.

https://www.tukangtokoonline.web.id/search/?q=Template
kata kunci pencarian di atas adalah Template. Sedangkan kode tag conditional yang digunakan adalah berikut ini.
<b:if cond='data:blog.searchQuery'>
kode object berupa HTML, CSS, dll
</b:if>

Sedangkan untuk mengatur elemen object pada pencarian kata kunci tertentu, contohnya Template, maka kode tag conditional yang digunakan adalah sebagai berikut.

<b:if cond='data:blog.searchQuery == &quot;Template&quot;'>
kode object berupa HTML, CSS, dll
</b:if>

Menampilkan elemen pada halaman custome (ditentukan)

elemen object bisa diatur tampilnya pada halaman yang ditentukan di blogspot, kode yang digunakan untuk pengaturan setting seperti ini adalah seperti berikut.

<b:if cond='data:blog.url == &quot;url halaman&quot;'>
kode object berupa HTML, CSS, dll
</b:if> 
Baca juga : Plugin Related Post di Tengah Post 

Menampilkan elemen pada Halaman Error

Dengan tag conditional, pengaturan tampilan pada laman Error pun bisa lebih mudah diatur. Nah, berikut ini adalah kode tag conditional yang dipakai pad halaman Error.

<b:if cond='data:blog.pageType == &quot;error_page&quot;'>
kode object berupa HTML, CSS, dll
</b:if>

Semoga bermanfaat

Komentar