Jenis Jenis Tag Kondisional dalam HTML dan Fungsinya

Jenis Jenis Tag Kondisional dalam HTML dan Fungsinya. Tag Kondisional adalah kode HTML yang memberikan fungsi atau kegunaan yang mengkhusus dalam HTML yang dibungkusnya. Dengan memasang condisional tag atau tag kondisional, kita dapat mengatur dimanakah atau kapankah HTML akan muncul. Bergitulah kira kira kegunaan dari Tag Kondisional.

Jenis Jenis Tag Kondisional dalam HTML dan Fungsinya jonarendra


Ada berbagai macam Tag Kondisional yang terdapat di HTML. Tetapi tidak perlu menghafalkan keseluruhannya. Kalau kodenya dihafal pasti tidak akan ingat. Sebaiknya di pahami artinya. Karena kode HTML kebanyakan yang berbahasa inggris. Coba saja lihat beberapa condisional tag yang ada dibawah ini.

Jenis Jenis Tag Kondisional

Halaman Beranda Blog (Home Page)

Tag kondisional pada halaman beranda blog adalah sebagai berikut
<b:if cond='data:blog.url == data:blog.homepageUrl'>
Pengertian dari halaman beranda disini adalah URL halaman depan dari blog. Tanpa path/cabang seperti:
http://jonarendra.blogspot.com

Halaman Index

Untuk seluruh laman index pada blog condisional tag nya adalah
<b:if cond='data:blog.pageType == "index"'>

Halaman Post / Artikel

Jika ingin menampilkan elemen pada halaman posting saja, tag kondisional yang digunakan adalah seperti ini
<b:if cond='data:blog.pageType == "item"'>
Contoh dari URL posting adalah begini
http://jonarendra.blogspot.com/2013/11/Jenis-Jenis-Tag-Kondisional.html

Halaman Statis

Halaman statis atau static page juga mempunyai kemiripan dengan posting. Biasanya sering disebut dengan Laman atau Page. Misalkan halaman statis pada blog ini seperti
http://jonarendra.blogspot.com/p/link.html
Elemen yang diatur dalam halaman statis dapat menggunakan tag kondisional, yaitu
<b:if cond='data:blog.pageType == "static_page"'>

Halaman Arsip

Archive atau arsip adalah halaman arsip pada tiap blog. Ini pun ada tag kondisional untuk mengatur elemen yang ada hubungannya dengan halaman arsip
<b:if cond='data:blog.pageType == "archive"'>

Halaman URL Tertentu

Jika ingin membuat kondisi blog berbeda pada halaman di URL tertentu anda bisa menggunakan tag kondisional yang ini
<b:if cond='data:blog.url == "URL TERTENTU"'>
Ganti saja URL TERTENTU dengan link anda

Halaman Post dan Statis

Ini berguna dan akan aktif pada halaman posting dan pages (static page)
<b:if cond='data:blog.pageType == "data:post.url"'>

Halaman Kesalahan / Error 404

Apabila ada link rusak, kesalahan perayapan ataupun link yang tidak ada dalam blog dicari pengunjung, akan tampil halaman Error 404. Untuk menambah CSS atau HTML pada halaman tersebut, gunakan tag seperti ini
<b:if cond='data:blog.pageType == "error_page"'>

Blog Dalam Kondisi Mobile

Kondisi blog yang dibuka dalam ponsel / mobile pasti harusnya memiliki tampilan yang ringan untuk dimuat. Jadi, pakai tag kondisional berikut jika ingin mengatur halaman blog pada mobile
<b:if cond='data:blog.isMobile'>
Halaman mobile ditandai dengan URL blog yang ditambahkan dengan ?m=1

Halaman Search Label

Tag kondisional juga ada yang berhubungan dengan halaman search label. Seperti berikut ini
<b:if cond='data:blog.pageType == data:blog.searchLabel'>
Contoh link search label adalah
http://jonarendra.blogspot.com/search/label/Informasi

Halaman Pencarian Label Tertentu

Pencarian pada label tertentu pun mempunyai tag kondisional tersendiri.
<b:if cond='data:blog.searchLabel == "LABEL"'>
Apabila anda ingin menampilkan atau tidak menampilkan suatu elemen pada halaman pencarian label tertentu, gunakan tag kondisional ini dengan mengganti LABEL dengan label yang diatur

Halaman Pencarian (Search Query)

Biasanya, kalau kita menggunakan search form untuk mencari sesuatu pada blog pasti kita dialihkan ke halaman dengan url begini
http://jonarendra.blogspot.com/search?q=
Jika anda ingin menambahkan sesuatu pada halaman pencarian / search gunakan tag kondisional berikut
<b:if cond='data:blog.pageType == data:blog.searchQuery'>

Halaman Pencarian Kata Kunci Tertentu

Lebih spesifik lagi dari yang diatas, ini tag kondisional apabila pencarian pada kueri tertentu
<b:if cond='data:blog.searchQuery == "KEYWORD"'>
Seperti contoh, saya ingin membuat halaman dengan CSS yang berbeda apabila ada pengunjung yang search dengan kata kunci 'blogger'. Maka, pasang tag kondisional seperti diatas dengan KEYWORD menjadi 'blogger'

Bagaimana? sudah lengkap belum Jenis Jenis Tag Kondisional yang saya berikan? Pastinya belum. Karena semuanya bisa dikembangkan lagi menjadi lebih spesifik/detail. Tetapi, apabila anda memiliki tag kondisional umum yang tidak saya buat diatas, silahkan kirim lewat komentar.

Kesimpulannya, Tag Kondisional adalah kode HTML yang digunakan untuk mengatur elemen tertentu pada blog untuk di tampilkan atau tidak ditampilkan pada halaman spesifik, serta pengaturan kondisi elemen tersebut.

6 comments for "Jenis Jenis Tag Kondisional dalam HTML dan Fungsinya"

  1. Ajib, ma! Templatenya super keren banget! Izin download buat koleksi.
    Terima dan salam kenal sekaligus mengundang untuk submit URL atau artikel dlam rangka launchingnya Direktori Blog Dofollow Indonesia terbaru. :)
    Sukses selalu.

    ReplyDelete
    Replies
    1. ini tag kondisional bukan download template =D
      sukses juga buat direktori nya

      Delete
    2. Mungkin postingan ini gak dibaca :D :D

      Delete
    3. mungkin maksudnya template blog ini =D

      Delete
  2. bisa dipelajari lagi nih, wah templatenya keren banget full color, kayak template inspirasi dari kang ismet, DTE, dll

    ReplyDelete
    Replies
    1. hehe, tau aja ^_^
      memang terinspirasi dari mereka..

      Delete

Post a Comment

Berkomentarlah dengan baik dan benar, dilarang SPAM!
Tata Tertib Berkomentar