Menyisipkan Tag Kondisional Pada Widget Popular Posts

Menyisipkan Tag Kondisional Pada Widget Popular Posts - Untuk mempersonalisasi dalam menampilkan atau menyembunyikan widget bawaan blogger (default) yang dipergunakan, kita bisa mengakalinya dengan menambahkan atau dengan kata lain menyisipkan Tag Kondisional (conditional tag) diantara script widget bawaan blogger.

Sebagai contoh kita akan menyembunyikan widget popular post bawaan blogger pada homepage, dengan kata lain widget tidak tampil pada homepage tetapi akan tampil pada halaman posting.

Ada kelebihan jika kita menyembunyikan widget pada halaman tertentu, pertama widget tetap terpasang pada blog dan sistem widget berjalan sesuai dengan fungsi dari widget tersebut, kedua dalam hal lain jika kita menyembunyikan widget pada halaman tertentu, maka akan menghemat loading blog.

① Macam Tag Kondisional Modifikasi Tampilan Desain Blog

Popular posts merupakan widget bawaan blogger yang banyak (mayoritas) dipakai/terpasang pada tiap blog (Blogger) dan banyak juga yang telah melakukan modifikasi dari segi tampilan untuk widget popular post ini, saya hanya mencoba untuk menyembunyikan widget popular post tersebut dengan menyisipkan tag kondisional untuk menghemat waktu loading blog pada halaman homepage.

Menentukan ID Widget

• Langkah Pertama yang harus kita lakukan adalah mengetahui ID dari widget popular posts, untuk mengetahui Id widget popular posts masuk pada menu Layout - dan pilih judul widget Popular posts dan klik - Edit, maka akan keluar popup window untuk widget popular post - Lihat pada alamat URL paling akhir seperti ini...&widgetType=null&widgetId=PopularPosts1. popularPosts1 merupakan Id dari widget popular post.
• Langkah Kedua masuk pada menu Edit HTML dan temukan Id PopularPosts1, secara default scriptnya seperti dibawah ini:

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'/>

Integrasi Tag Kondisional

Setelah masuk pada menu edit template, jangan lupa untuk mencentang expand template widget supaya script terlihat semua, dan akan terlihat script widget popular post seperti dibawah ini:

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
  <b:if cond='data:title'><h2><data:title/></h2></b:if>
  <div class='widget-content popular-posts'>
    <ul>
      <b:loop values='data:posts' var='post'>
      <li>
        <b:if cond='data:showThumbnails == &quot;false&quot;'>
          <b:if cond='data:showSnippets == &quot;false&quot;'>
            <!-- (1) No snippet/thumbnail -->
            <a expr:href='data:post.href'><data:post.title/></a>
          <b:else/>
            <!-- (2) Show only snippets -->
            <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
            <div class='item-snippet'><data:post.snippet/></div>
          </b:if>
        <b:else/>
          <b:if cond='data:showSnippets == &quot;false&quot;'>
            <!-- (3) Show only thumbnails -->
            <div class='item-thumbnail-only'>
              <b:if cond='data:post.thumbnail'>
                <div class='item-thumbnail'>
                  <a expr:href='data:post.href' target='_blank'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                  </a>
                </div>
              </b:if>
              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
            </div>
            <div style='clear: both;'/>
          <b:else/>
            <!-- (4) Show snippets and thumbnails -->
            <div class='item-content'>
              <b:if cond='data:post.thumbnail'>
                <div class='item-thumbnail'>
                  <a expr:href='data:post.href' target='_blank'>
                    <img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                  </a>
                </div>
              </b:if>
              <div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
              <div class='item-snippet'><data:post.snippet/></div>
            </div>
            <div style='clear: both;'/>
          </b:if>
        </b:if>
      </li>
      </b:loop>
    </ul>
    <b:include name='quickedit'/>
  </div>
</b:includable>
</b:widget>

Sisipkan tag kondisional <b:if cond='data:blog.pageType == "item"'> dibawah kode <b:includable id='main'> dan tutup tag dengan </b:if> yang letaknya diatas </b:includable> seperti ini:

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
  <b:if cond='data:title'><h2><data:title/></h2></b:if>
  <div class='widget-content popular-posts'>
    
                         ...
                  script saya potong
                         ...

<b:include name='quickedit'/>
  </div>
</b:if>
</b:includable>
</b:widget>

Untuk mempersonalisasi widget-widget pada halaman lainnya, kalian bisa melihat Macam Tag Kondisional yang bisa dipergunakan untuk menampilkan dan menyembunyikan widget pada tiap halaman.

Berbeda dengan widget yang secara manual (bukan bawaan blogger) kita pasang pada Add Gadget - HTML/Javascript (pada menu layout), script tidak terlihat pada menu Edit HTML, baik itu script html maupun javascript, walaupun melakukan pen-centangan pada expand template widget.

Untuk lebih jelasnya masuk Link Ini untuk memperjelas, atau jika ingin menyisipkan tag kondisional pada pada widget-widget bawaan blogger lainnya, bisa meng-klik Link Ini untuk mengetahuinya.