Langsung ke konten utama

Mengenal Tag Conditional dan Fungsinya di Blogspot

www.domainesia.com

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

Buka Komentar

Komentar

Popular

2 Template Toko Online Blogspot Gratis Rasa Premium

Untuk me-review Template Toko Online yang pernah didesain ulang Tukang Toko Online, posting kali ini sengaja untuk memberikan sedikit informasi untuk pengunjung setia Tukang Toko Online yang mungkin sempat ketinggalan info mengenai template toko online gratis namun dengan rasa premium.Nah berikut ini adalah 2 template toko online blogspot gratis yang juga memiliki pilihan premium jika anda berniat untuk mendapatkan fitur tambahan yang lebih lengkap. Itulah mengapa ke dua template tersebut be-rasa premium. Anda bisa mengunduhnya secara gratis dari link kedua artikel template tersebut. Jangan lupa meninggalkan komentar berupa saran saran atau apapun demi perbaikan layanan template dari Tukang Toko Online.Berikut ini adalah informasi mengenai ke dua Template Tersebut.


tukutoko THEME
Live DemoDownload Fitur  Super Responsive / mobile firendlyWhatssApp OrderSMS OrderCall OrderHelp Desk widgetHotline button to WhatsApp, SMS & Phone CallSlide MenuRelated Product Postetc.Baca juga :Ngeblog da…

Toko Online Blogspot Super Responsive dengan tukutoko THEME

Template blogspot toko online baru ini dirancang dengan tampilan yang sederhana dan terfokus pada produk yang dijual. Dan yang terpenting adalah sengaja dirancang untuk memfokuskan pada berbagai fitur di tampilan mobilenya. Hal ini untuk menjawab penetrasi akses internet melalui mobile device (smartphone) yang sudah mencapai 80% lebih di Indonesia.Ya, tujuannya adalah untuk menggaet pembeli yang mengakses internet via ponsel karena pasar yang besar tersebut. Otomatis beberapa fitur yang disematkan pada template ini sebisa mungkin fitur-fiturnya juga sudah harus mendukung untuk tujuan tersebut.Sebelum membahas lebih jauh tentang berbagai fitur yang tersemat pada tukutoko THEME ini, sebaiknya Anda memeriksa dulu live demo templatenya, karena difokuskan untuk tampilan yang mobile friendly, Anda bisa mengeceknya melalui ponsel favorit Anda.
Baca juga : 
Template Gratis Download untuk Bisnis Wisata dan Agen TravelNgeblog dan Jualan dengan satu Template Toko Online Gratis ini LIVE DEMODOWNLOAD

Gratis Download Template Toko Online Blogspot Responsif Baru dan Keren

Menyongsong hari kemerdekaan RI di tahun ini, Tukang Toko Online juga ingin memberikan hadiah berupa bagi-bagi template toko online blogspot terbaru secara gratis.

Template yang akan dibagikan gratis ini merupakan versi Lite-nya dari Template Toko-01 yang barusan di luncurkan sebelumnya. Meskipun demikian sejumlah fitur utama tetap disertakan pada template ini, sehingga tidak mengurangi fungsi serta kebutuhan utama untuk toko online Anda.

Beberapa fitur wajib seperti, meta tag SEO, payment widget, opsi order, info contact, customer service dll. sudah ada dan siap digunakan pada template ini. Panduan step by stepsetting templatenya tetap akan diberikan meskipun template toko-02 ini dibagikan secara gratis.



Tapi tentu saja, meskipun Anda tidak harus membayar untuk mendapatkan template ini, tetap ada sejumlah syarat yang harus Anda penuhi untuk mendapatkan template ini, seperti halnya jika Anda pernah mengunduh beberapa template gratis di blog ini. Syaratnya cukup mudah dan tidak membera…
© Tukang Toko Online