Cara Memasukkan Conditional Tags ke Tema Blogger

Conditional Tag merupakan salah satu fungsi penting pada struktur template di Blogger. Fungsi ini digunakan untuk penyesuaian tertentu, biasanya digunakan untuk menampilkan widget atau elemen di tempat tertentu. Tag kondisional digunakan saat Anda menyesuaikan tema Blogger Anda. Dengan memasukkan kondisi tertentu Anda dapat membatasi widget untuk muncul/disembunyikan pada halaman atau halaman tertentu seperti Beranda, Halaman, Halaman Barang, Label, Label Tertentu, Halaman Tertentu, dan Halaman Barang Tertentu.

Tag Bersyarat untuk Blogger dimulai dengan <b:if dan diikuti dengan kondisi yang diinginkan. Di bawah ini adalah Tag Kondisional Blogger versi terbaru yang dapat Anda gunakan pada Template Blogger Anda.

sebelum kita lebih jauh mempelajari tag kondisional, ada baiknya kita mengetahui struktur yang ada di blogger.

1. Jenis Halaman di Blogger

Seperti yang kita ketahui dalam sebuah blogger terdapat banyak sekali halaman, seperti halaman beranda, page, post, label dan lainnya. Pada bagian ini kita akan mempelajari berbagai jenis halaman yang ada di blogger.

a. Halaman beranda (Homepage)

Halaman beranda atau homepage adalah halaman utama blogger atau halaman awal yang muncul di browser saat Anda menelusuri URL domain seperti “https://www.unixwinbsd.site“. Semua bagian dan halaman situs web dapat dinavigasi dari beranda.

b. Halaman Pages (halaman statis)

Halaman pages di Blogger adalah halaman statis yang Anda buat dari bagian halaman. Blogger membatasi halaman pages ini sebanyak 20 pages. Hal ini agak beda dengan halaman postingan/artikel yang dapat anda buat sebanyak mungkin, bahkan jika anda mampu menulis anda dapat membuat artikel dalam jumlah ribuan artikel.

Pada halaman pages biasanya hanya berisi informasi seputar informasi blogger anda, seperti Tentang Kami (About Us), Kebijakan Privasi, Hubungi Kami, Conatct, sitemap dan lain-lain. Halaman tersebut memiliki URL dalam format ini: “https://www.unixwinbsd.site/p/about.html“. Di sini /p/ memberitahukan bahwa itu adalah sebuah halaman. Tahun dan bulan tidak ditambahkan pada URL halaman Blogger.

c. Halaman artikel (Item Page)

Saat Anda mengklik postingan atau artikel, detailnya akan dibuka di halaman postingan. Pada blogger halaman artikel (Item page) memiliki URL dalam format  "https://www.unixwinbsd.site/2023/09/installation-and-basic-setup-of-tomcat.html". Tahun dan bulan dibuatnya artikel dimasukkan kedalam halaman artikel.

d. Halaman Pencarian (label search)

Halaman pencarian label berisi postingan dari label tertentu. Ini memiliki URL dalam format ini: "https://www.unixwinbsd.site/search/label" atau 

"https://www.unixwinbsd.site/search/label/ANONYMOUS".

2. Simbol Yang Digunakan dalam Conditional Tags

Pada bagian ini kita akan mempelajari, beberapa simbol yang digunakan dalam tag kondisional.

a. “!=”

Simbol “!=” artinya tidak sama dengan, digunakan untuk mengevaluasi dua object. Simbol ini akan mengevaluasi menjadi benar jika dua objek tidak sama.

b. “==”

Simbol “==” artinya sama dengan, digunakan untuk mengevaluasi dua object. Simbol ini akan mengevaluasi menjadi benar jika dua objek sama.

c. “=”

Tanda “=” menunjukkan persamaan seperti 5+4 = 9 atau seperti x = 10, artinya x bernilai 10.

d. “or and ||”

OR atau UNION digunakan untuk menggabungkan beberapa kondisi, yang jika salah satu kondisi dianggap benar, maka akan langsung merender konten HTML. Anda dapat menggunakan simbol "or" atau simbol ampersand "||".

e. “and and &&”

Digunakan untuk menggabungkan dua atau lebih dari dua kondisi. Semua persyaratan harus benar. Anda dapat menggunakan simbol "and" atau simbol ampersand "&&".

f. ! and not

Digunakan ketika Anda ingin mengecualikan sesuatu dari kondisi. Gunakan simbil "not" atau "!".

3. Penggunaan Conditional Tags pada Template Blogger

Pada bagian ini kita akan mempelajari cara penggunaan tag kodisional pada tempalte blogger. Cara menempatkan dan proses penulisannya akan kita pelajari pada bagian ini.

a. Tag kondisonal pada halaman beranda

Untuk menampilkan widget hanya di Beranda: 

<b:if cond='data:blog.url == data:blog.homepageUrl'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta content='website' property='og:type'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta expr:content='&quot;Read &quot; + data:blog.pageTitle + &quot; to know what you've been searching for...&quot;' property='og:description'/>
</b:if>
</b:if>

Untuk menampilkan widget di semua halaman kecuali Beranda:

<b:if cond='data:blog.url != data:blog.homepageUrl'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<meta expr:content='data:blog.title' property='og:title'/>
<meta content='website' property='og:type'/>
<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' property='og:description'/>
<b:else/>
<meta expr:content='&quot;Read &quot; + data:blog.pageTitle + &quot; to know what you've been searching for...&quot;' property='og:description'/>
</b:if>
</b:if>

b. Tag kondisonal pada halaman artikel (Item Page)

Untuk menampilkan widget hanya pada halaman artikel.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<title><data:blog.pageName/> - <data:blog.title/></title>
<b:include data='blog' name='all-head-content'/>
<meta expr:content='data:blog.pageName + &quot; - &quot; + data:blog.title' name='keywords'/>
</b:if>

Untuk menampilkan widget di semua halaman kecuali halaman artikel

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<title><data:blog.pageName/> - <data:blog.title/></title>
<b:include data='blog' name='all-head-content'/>
<meta expr:content='data:blog.pageName + &quot; - &quot; + data:blog.title' name='keywords'/>
</b:if>

c. Tag kondisonal pada halaman Pages (halaman statis)

Untuk menampilkan widget hanya pada halaman statis saja

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if></b:if>

Untuk menampilkan widget di semua halaman kecuali halaman statis.

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if></b:if>

d. Tag kondisonal pada halaman pencarian label

Untuk menampilkan widget hanya di halaman pencarian/label.

<b:if cond='data:blog.searchLabel'>
<meta content='noindex,nofollow' name='robots'/>
</b:if>

4. Penggunaan Conditional Tags if/else

Bagi anda yang tak terbiasa dengan coding template blogger, mengontrol visibilitas elemen tertentu, seperti widget  di halaman blogger bisa sedikit membingungkan. Pada bagian ini kita akan mempelajari cara menggunakan tag if/else untuk menyembunyikan atau menampilkan elemen pada halaman tertentu di blogger.

Dalam tag kondisional If/else Anda memberikan lebih dari satu opsi untuk dieksekusi ketika kondisi pertama tidak terpenuhi. Anda menambahkan Else setelah kondisi If. Baiklah, sekarang mari kita mulai dengan dasar-dasarnya atau langsung saja ke pengkodean.

Tag <b:if> dan <else>digunakan untuk menulis pernyataan kondisional. Pernyataan kondisional bisa seperti ini: JIKA anda berada di halaman beranda, tampilkan semua widget blogger. JIKA TIDAK, tampilkan halaman statis saja (pages).

Untuk lebih memudahkan anda dalam mempelajari funsi if/else, berikut kami lampirkan beberapa contoh yang dapat anda analisis.

<b:if cond='data:blog.metaDescription'>
<meta expr:content='data:blog.metaDescription' name='description'/>
<b:else/>
<meta expr:content='data:blog.metaDescription + &quot; Belajar blog metadescription &quot;' name='description'/>
</b:if>

Pada contoh script di atas bisa di artikan, jika data blog berisi metadescription, isi content deskripsi data blog akan di isi dengan tulisan "google,blog,blogger,blogspot,cms,template,robots,ads,adsense,bootstrap,widget,script,theme,setting,windows,domain,monetisasi,layout" yang ada di Meta tags Search description yang ada di kaun blogger anda seperti gambar di bawah ini.

Dan selanjutnya jika Meta tags Search description kosong (tak ada tulisan), seperti gambar di bawah ini

Maka isi deskripsi data blog akan berisi tulisan "Belajar blog metadescription", sperti <b:else/> dari script di atas.

Berikut ini kami akan berikan dua contoh scrip if/else, kami harap anda dapat menganalisisnya seperti analisis yang kami contohkan di atas.

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<title><data:blog.pageTitle/>Belajar fungsi if else di blogger</title>
<b:else/>
<b:if cond='data:blog.pageType != &quot;error_page&quot;'>
<title><data:blog.pageName/> - <data:blog.title/></title>
</b:if></b:if>

Biar tak merepotkan anda, baiklah coba kita analisis pernyataan kondisional dari fungsi if/else di atas.

Jika kondisi data:blog.pageType yang bernilai index (halaman beranda, label, pencarian dan halaman postingan), maka harus di isi dengan tulisan yang berasal dari data:blog.pageTitle "Belajar fungsi if else di blogger", jika title pada data:blog.pageType tak ditemukan maka akan muncul pesan error dengan tulisan pesan yang berasal dari data:blog.pageName dan data:blog.title.

Contoh kedua dapat anda lihat scriptnya seperti di bawah ini.

<b:if cond='data:view.isMultipleItems'>
  <b:if cond='data:view.isHomepage'>
    <!--[ Homepage title ]-->
    <title><data:blog.title.escaped/></title>
    <b:elseif cond='data:view.search.query'/>
    <!--[ Search title ]-->
    <title><data:messages.search/>: <data:view.search.query/></title>
    <b:elseif cond='data:view.search.label'/>
    <!--[ Label title ]-->
    <title><data:blog.pageName.escaped/> - <data:blog.title.escaped/></title>
    <b:elseif cond='data:view.isArchive'/>
    <!--[ Archive title ]-->
    <title>Blog archive in: <data:blog.pageName.escaped/></title>
    <b:else/>
    <title>Blog: <data:blog.title.escaped/></title>
  </b:if>
  <b:elseif cond='data:view.isError'/>
  <!--[ Error title ]-->
  <title>Error 404: Not found</title>
  <b:else/>
  <!--[ SingleItem title ]-->
  <title><data:blog.pageName.escaped/> - <data:blog.title.escaped/></title>
</b:if>

Silahkan anda analisis sendiri arti dari fungsi if dan else di atas. Selamat menganalisis.