Cara Menampilkan Widget Tertentu pada Halaman Blog


KURAZONE ~ Bagi yang suka oprek kode HTML maupun CSS, tentunya pernah mengalami tampilan template yang penuh dengan widget. Entah itu ketika blog sedang dimuat pada halaman beranda, posting, laman statis, arsip maupun halaman sesuai URL tertentu, sehingga ada beberapa widget yang ingin disembunyikan pada tampilan khusus.

Contohnya seperti widget Popular Posts yang hanya tayang di beranda, tapi tidak tayang ketika berada di halaman posting. 

Untuk mengakali hal tersebut, maka yang diperlukan adalah menggunakan Tag Conditional yang ditambahkan pada elemen-elemen widget yang diinginkan. Namun sebelum menambahkan Tag Conditional tersebut - kita harus mengetahui terlebih dahulu ID Widget mana yang akan kita berikan Conditional.

Langkah 1
Langkah pertama adalah kalian perlu mencari ID Widget mana yang ingin kalian tampilkan pada Halaman tertentu.
  • Masuk ke Akun Blogger
  • Pilih Tata Letak / Layout
  • Pilih "Edit" pada salah satu widget yang diinginkan 
  • Perhatikan URL nya, disana kalian akan menjumpai ID Widget

  • Dalam contoh gambar diatas, ID Widgetnya adalah HTML 5, hafalkan atau copy ID tersebut. 
  • Selanjutnya masuk ke menu Tema / Template, pilih Edit HTML
  • Didalam kode HTML, tekan CTRL+F lalu tulis HTML 5 (misalnya)
  • Setelah ID Widgetnya ketemu, maka selanjutnya tinggal melakukan langkah ke 2 dibawah.

Langkah 2
Pada langkah ini kita tinggal memberikan Tags Conditional pembuka dan Tags Conditional penutup.
Tags Conditional pembuka menggunakan dengan kode <b:if cond='xxx'> yang diletakkan tepat dibawah kode <b:includable id='main'>, sedangkan untuk Tags Conditional penutup menggunakan kode </b:if> yang diletakkan tepat dibawah kode <b:include name='quickedit'/>

NOTE :
Mohon untuk lebih teliti dalam menempatkan kode Tags Conditional agar tidak error saat proses penyimpanan template. Silahkan pilih Tags Conditional dibawah ini sesuai keinginan kalian.

Menampilkan Widget HANYA di Homepage / Beranda

<b:widget id='HTML5' locked='false' title='' type='HTML'>
<b:widget-settings>
<b:widget-setting name='content'>
</b:widget-settings>
isi konten widget
</b:widget-setting>
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<div class='widget-content'>
<h2 class='title'><data:title/></h2>
</b:if>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

Menampilkan Widget HANYA di Halaman Posting

<b:widget id='HTML5' locked='false' title='' type='HTML'>
<b:widget-settings>
<b:widget-setting name='content'>
</b:widget-settings>
isi konten widget
</b:widget-setting>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<div class='widget-content'>
<h2 class='title'><data:title/></h2>
</b:if>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

Menampilkan Widget HANYA di Halaman Statis

<b:widget id='HTML5' locked='false' title='' type='HTML'>
<b:widget-settings>
<b:widget-setting name='content'>
</b:widget-settings>
isi konten widget
</b:widget-setting>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "static_page"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<div class='widget-content'>
<h2 class='title'><data:title/></h2>
</b:if>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

Menampilkan Widget HANYA di Halaman Arsip/Archive

<b:widget id='HTML5' locked='false' title='' type='HTML'>
<b:widget-settings>
<b:widget-setting name='content'>
</b:widget-settings>
isi konten widget
</b:widget-setting>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "archive"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<div class='widget-content'>
<h2 class='title'><data:title/></h2>
</b:if>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

Menampilkan Widget HANYA di Halaman Tertentu Berdasarkan URL

<b:widget id='HTML5' locked='false' title='' type='HTML'>
<b:widget-settings>
<b:widget-setting name='content'>
</b:widget-settings>
isi konten widget
</b:widget-setting>
<b:includable id='main'>
<b:if cond='data:blog.url == "Ganti dengan URL Halaman di sini"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != &quot;&quot;'>
<div class='widget-content'>
<h2 class='title'><data:title/></h2>
</b:if>
<data:content/>
</div>
</b:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>

Setelah tags conditional ditambahkan - jangan lupa untuk menyimpannya. Lakukan hal yang sama terhadap widget lain apabila kalian menghendaki untuk menampilkan widget pada halaman tertentu, namun sebelumnya - terlebih dahulu adalah mencari ID widget supaya tidak bingung terhadap widget mana yang ingin di setting.

Itulah informasi mengenai "Cara Menampilkan Widget pada Halaman Tertentu (Homepage/ Posting/ Statis/ Archive/ URL)", selamat mencoba dan semoga bermanfaat.





Lebih baru Lebih lama