Kondisional Halaman “selected” pada Widget Label Blogspot Tidak Konsisten

Saya anggap Anda sedang memakai widget Label/Kategori yang masih murni merupakan bawaan dari Blogger. Saat kita mengunjungi halaman label, pada bagian tautan label seharusnya akan berubah menjadi elemen <span> yang tidak bisa diklik seperti ini:

Label Widget in Blogspot
Tanda bahwa halaman label “JavaScript” sedang dikunjungi.

Ini bagus, karena widget dapat memberikan informasi kepada kita mengenai di mana kita sedang berada saat itu. Akan tetapi, ketika kita mengeklik tautan menuju posting yang lebih lama, tanda tersebut malah hilang:

Broken Label Widget
Tanda yang menyatakan bahwa halaman label “JavaScript” sedang dikunjungi rusak pada halaman berikutnya.

Ini tidak bagus. Tanda label tersebut seharusnya bisa tetap ada meskipun kita sudah berpindah-pindah ke halaman yang lain asalkan kita masih berada dalam halaman indeks kategori/label yang sama. Ini terjadi karena kondisional penanda pada widget label sudah salah sejak awal. Perhatikan bagian yang Saya tandai:

<b:widget id='Label1' locked='false' title='Label' type='Label'>
  <b:includable id='main'>
    <b:if cond='data:title'>
      <h2><data:title/></h2>
    </b:if>
    <div expr:class='&quot;widget-content &quot; + data:display + &quot;-label-widget-content&quot;'>
      <b:if cond='data:display == &quot;list&quot;'>
        <ul>
          <b:loop values='data:labels' var='label'>
            <li><b:if cond='data:blog.url == data:label.url'>                <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
              <b:else/>
                <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
              </b:if>
              <b:if cond='data:showFreqNumbers'>
                <span dir='ltr'>(<data:label.count/>)</span>
              </b:if>
            </li>
          </b:loop>
        </ul>
      <b:else/>
        <b:loop values='data:labels' var='label'>
          <span expr:class='&quot;label-size label-size-&quot; + data:label.cssSize'><b:if cond='data:blog.url == data:label.url'>              <span expr:dir='data:blog.languageDirection'><data:label.name/></span>
            <b:else/>
              <a expr:dir='data:blog.languageDirection' expr:href='data:label.url'><data:label.name/></a>
            </b:if>
            <b:if cond='data:showFreqNumbers'>
              <span class='label-count' dir='ltr'>(<data:label.count/>)</span>
            </b:if>
          </span>
        </b:loop>
      </b:if>
      <b:include name='quickedit'/>
    </div>
  </b:includable>
</b:widget>

Menggunakan perbandingan URL sebagai kondisional halaman label tidak akan berhasil, karena URL pada setiap halaman itu pasti akan berubah-ubah meskipun kita masih berada pada kategori/label yang sama. Untuk memperbaikinya, ganti kode yang Saya beri tanda dengan ini:

<b:if cond='data:blog.searchLabel == data:label.name'>

Simpan perubahan.

23 Komentar

  • Unknown

    Wah kapan updatenya nih, tadi saya lewat sini masih gakda nih artikel.
    BTW punya saya juga punya masalah seperti itu.
    Ini tidak bagus. Tanda label tersebut seharusnya bisa tetap ada meskipun kita sudah berpindah-pindah ke halaman yang lain asalkan kita masih berada dalam halaman indeks kategori/label yang sama.
    Emang tidak bagusnya dimana mas?? untuk SEO-kah Mas???

    • Taufik Nurrohman

      Cuma terkesan membingungkan pengguna saja, dan terutama terkesan rusak.

      • Unknown

        Iya juga seh. :)
        kalau misalkan mau membatasi pencarian label seperti punya mas taufik ini gimana ya??
        http://www.dte.web.id/search/label/Browser?max-results=20

      • Unknown

        Oops maaf mas sudah ketemu. http://www.dte.web.id/2012/03/membatasi-jumlah-posting-pada-halaman.html

  • FN

    Untungnya saya tidak menggunakan widget tersebut gan 0:). jadi selamat dari yg namanya mengubah kode.

  • you

    belum pernah mengalami kasus ini, tapi untuk jaga-jaga akan diubah.. terima kasih

  • Unknown

    udah tak pasang :p

  • Kang Rian

    sangat membangun, saya paling senang dengan postingan tutorial blog yang membahas permasalahan tag conditional nya langsung. jadi lebih memahami, dan mulai belajar dari kesalahan kecil yang berdampak lumayan merepotkan :D .

    Terima kasih mas taufik.

  • Unknown

    Kenyamanan pengguna adalah penting. Karena itu hal hal kecil sekalipun harus diawasi agar UE tetap terjaga :)

  • Kang Kapuk

    Mas Ovic, permasalahan yg dihadapi, tatkala label berbentik 'Cloud, dengan pengaturan diberi background untuk list stylenya. Setelah di klik pada area label, Link yg seharusnya aktif, menjadi link pasif alias gak muncul jadi Link. Adakah solusinya...?

    • Taufik Nurrohman

      Itu karena tautan pada halaman label aktif berganti menjadi elemen <span> seperti ini:

      <b:if cond='data:blog.searchLabel == data:label.name'>
      <span><data:label.name/></span>
      <b:else/>
      <a expr:href='data:label.url'><data:label.name/></a>
      </b:if>
  • Admin

    memang terkadang sering terabaikan, kreaktif juga mas tanfik :-bd

  • Unknown

    mas Taufik, saat dklik breadcrumb lalu yg tampil blank, ko bisa yaa? kayak pnya sy..

    • Taufik Nurrohman

      Itu tidak ada hubungannya sama ini. Pasti masalahnya ada di halaman indeks. Mungkin pernah membuat kondisional semacam ini di dalam posting:

      <b:if cond='data:blog.pageType != &quot;item&quot;'>
      …
      </b:if>
  • Abdelghafour

    Thank you for this tutorial it's very helpful. I have a question about news template ?

    I want to make a news template and I want to show posts by the label widget for example
    the user will add a label widget and chose the category that he wanted to show posts from than simply the posts showed in blog. The system that I want to use is the same in this template if can tell me or give me the code that will let me able to do this I would be grateful to you.

    Thanks again :)

  • Unknown

    Sangat jeli memperhatikan hal-hal seperti ini ;) tapi apakah semua template gitu ya kang?

  • Beben Koben

    max-results sama updated-max apa sama?
    sy tdk paham ah, tapi kalo dari postingan ini mah, script json yg pada contoh, dan pada contoh lain hyperlink...
    kalo yg dimaksudkan ilang 9999, kan yg pada hyperlink halaman blog punya fungsi membatasi page yg tampil. dan bukan json tentunya...

    kabuuuuuurrrr....ampuuunnnn

    • Taufik Nurrohman

      Setahu Saya kalau max-results itu mengambil deret posting dari ukuran jumlah, kalau updated-max itu mengambil deret posting dari parameter waktu penerbitan. Tidak tahu bedanya, belum pernah pakai.

  • Unknown

    Misi mas, izin buat dicoba walaupun masih kurang ngerti kegunaan dan mamfaat !!!! :D

  • Unknown

    sangat membantu mbah makasih

Komentar telah ditutup.