Cara Menampilkan Widget di Halaman Tertentu - Blogspot

Menampilkan widget di halaman tertentu blogspot, bisa memberikan kesan dinamis dan profesional pada tampilan blog itu sendiri. Apalagi jika banyak widget menarik yang ingin dimunculkan tapi tidak bisa dimuat keseluruhan dalam satu halaman, maka ini adalah tips yang pas untuk diaplikasikan.

Membuat widget blog tampil di halaman tertentu dapat dilakukan dengan menambahkan beberapa script pada rumus html dari widget yang dimaksud. Agar lebih jelas berikut ini panduan selengkapnya cara menampilkan widget blog di halaman tertentu :

1. Masuk ke akun blog anda.

2. Tentukan widget mana yang akan ditampilkan pada halaman tertentu
 
3. Cari ID dari widget tersebut, caranya buka jendela pengaturan widget pada
    menu Tata Letak, lalu lihat kode terakhir dari Link URL pada jendela
    pengaturan widget. Misal HTML6.



4. Berikutnya buka Menu Template => Edit HTML, dan cari ID/kode HTML6
    menggunakan kolom pencarian dengan menekan kombinasi tombol CTRL + F.

5. Maka akan muncul kode html persis seperti dibawah ini :

<b:widget id='HTML6' locked='false' title='' type='HTML' visible='true'>
    <b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
  <b:include name='quickedit'/>
</b:includable>
  </b:widget>

6. Pilih kode-kode script berikut, berdasarkan jenis halaman tempat
    menampilkan widget yang memiliki ID HTML6 tadi.

A. Menampilkan widget hanya di halaman depan saja (homepage).

<b:if cond='data:blog.url == data:blog.homepageUrl'>
......................................................
</b:if>

B. Menampilkan di semua halaman kecuali halaman depan (homepage).

<b:if cond='data:blog.url != data:blog.homepageUrl'>
......................................................
</b:if>

C. Menampilkan widget hanya di halaman Archive saja.

<b:if cond='data:blog.pageType == &quot;archive&quot;'>
......................................................
</b:if>

D. Menampilkan widget di semua halaman kecuali halaman archive.

<b:if cond='data:blog.pageType != &quot;archive&quot;'>
......................................................
</b:if>

E. Menampilkan widget hanya di halaman posting.

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

  
F. Menampilkan widget di semua halaman, kecuali halaman posting.

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

  
G. Menampilkan widget hanya di postingan tertentu saja.

<b:if cond='data:blog.pageType == &quot;alamat-postingan&quot;'>
......................................................
</b:if>

 
H. Menampilkan widget selain di postingan tertentu.

<b:if cond='data:blog.pageType != &quot;alamat-postingan&quot;'>
......................................................
</b:if>

  
I. Menampilkan widget hanya di halaman staticpages.

<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
......................................................
</b:if>

  
J. Menampilkan widget di semua halaman, kecuali halaman staticpages.

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
......................................................
</b:if>

Keterangan : Tulisan titik-titik diatas adalah letak kode HTML dari widget.

7. Jika sudah menentukan kode script berdasarkan jenis halaman tempat
    menampilkan widget, selanjutnya tambahkan kode tersebut kedalam kode 
    html dari widget dengan ID HTML6 :

- Kode Sebelum 

<b:widget id='HTML6' locked='false' title='' type='HTML' visible='true'>
    <b:includable id='main'>
  <!-- only display title if it's non-empty -->
  <b:if cond='data:title != &quot;&quot;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
  <b:include name='quickedit'/>
</b:includable>
  </b:widget>

- Kode Sudah

<b:widget id='HTML6' locked='false' title='' type='HTML' visible='true'>
    <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;'>
    <h2 class='title'><data:title/></h2>
  </b:if>
  <div class='widget-content'>
    <data:content/>
  </div>
  <b:include name='quickedit'/>
</b:if>
</b:includable>
  </b:widget>

Perhatian : kode <b:if cond='data:blog.url == data:blog.homepageUrl'> letaknya setelah kode
<b:includable id='main'> dan kode </b:if> setelah kode </b:includable>, lihat tulisan 
berwarna merah diatas.

8. Terakhir tekan tombol save template. Selamat mencoba...