Membuat Widget Hanya Tampil di Halaman Posting Saja

Membuat Widget Hanya Tampil di Halaman Tertentu
Contoh html


Terkadang karena terlalu asyik nge-blog kita jadi lupa jika space atau ruang untuk tempat widget sudah penuh. Nah, untuk temen-temen blogger yang mengalami masalah seperti itu, kali ini saya akan memberikan tips kepada anda semua tentang cara menampilkan widget hanya pada halaman tertentu. Ini seperti template buatan Kang Rohman yang ada sebagian widgetnya hanya muncul pada homepage, sedangkan saat di klik postinganya widgetnya hilang. Agar lebih jelas anda dapat melihat di blog ini dimana widget artikel terbaru dengan thumbnail tidak terlihat di halaman posting tapi jika anda klik homepage saya widget tersebut akan nongol. Jika anda tertarik, di bawah ini adalah cara-cara membuatnya :

Login dengan account blogger anda.
Kemudian menuju  layout >> Edit HTML
Jangan lupa centang expand widget template nya, karena kalau tidak kode di bawah nanti tidak akan keluar. Sebenarnya kita hanya perlu menambah kan 2 tag kode saja, lihat kode dibawah ini:

<b:widget id='HTML1' locked='false' title='Artikel Terbaru' type='HTML'>
<b:includable id='main'><b:if cond='data:blog.pageType == "item"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<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>

Anda perhatikan kode yang berwarna merah tadi, itu adalah selipan kedua tag kode tadi, dan warna kuning yang Artikel Terbaru itu adalah judul wiget anda. Temen-temen bisa sesuaikan dengan judul widget yang anda ingin widget tersebut hanya tampil hanya pada homepage, sebagai contoh anda bisa klik pada home page blog ini.

Jika temen-temen menginginkan widget itu tampil hanya pada halaman psotingan, tinggal merubah kode yang berwarna merah dengan kode:

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

seperti dibawah ini.

<b:widget id='HTML1' locked='false' title='Artikel Terkait' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'>
<!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<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>

Pada tulisan berkedip warna kuning sebagai contoh Artikel Terkait, karena widget itu hanya tampil pada halaman postingan di blog ini. Cukup mudah bukan? Selamat mencoba dan semoga bermanfaat.

Referensi : www.maskolis.com

UPDATE!!!

Kini tak hanya di halaman post saja sekarang sudah banyak variasi tag nya!!

 Ketika kita sedang menuju blog seseorang, terlihat tampilan widget blog tersebut kadang ganti-ganti. Misalnya, di halaman depan Wigdet A, di halalaman lainnya Widget A tidak muncul. Ada apa gerangan....

Inilah variasi terbarunya!!! (tips ini bertujuan untuk mempercantik tampilan blog).

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


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

2. Menampilkan di semua halaman kecuali homepage.


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

3. Menampilkan widget hanya di halaman Archive saja.


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

4. Menampilkan widget di semua halaman kecuali halaman archive.


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

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


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

6. Menampilkan widget hanya di postingan tertentu saja.


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

7. Menampilkan widget selain di postingan tertentu.


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

8. Menampilkan widget hanya di halaman staticpages.


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

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


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

Catatan : Tanda Titik - titik di atas adalah kode widget yang harus di tempatkan

Sebagai Contoh perhatikan di bawah ini.
Coba anda menuju Dunia Sarah. Di halaman depan Widget Fan Facebook tidak muncul. Lalu di halaman kedua ketika klik sebuah artikel, maka Widget Fan Facebook muncul. Untuk melakukan hal itu silahkan coba ikuti langkah berikut.

Menampilkan Widget Tertentu Di Halaman Tertentu
1. Tentunya anda harus buka akun blog anda sendiri.
2. Masuklah ke Elemen Template. Lalu klik Edit HTML
3. Carilah widget yang anda sembunyikan (sebelumnya anda sudah memasang widget di dalam blog anda).
4. Misalnya Widget Fan Facebook. Silahkan cari tulisan "Fan Facebook" (gunakan Ctrl + F untuk mencari secara cepat)
5. Setelah ketemu, maka akan muncul kode persis seperti dibawah ini.

<b:widget id='HTML4' locked='false' title='Fan Facebook' type='HTML'> <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. Selanjutnya tambahkan kode


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


sebelum kode


<!-- only display title if it's non-empty --> 


7. Setelah ditambahkan lalu masukkan kode </b:if> sebelum kode


</b:includable> </b:widget>


8. Maka hasilnya akan persis seperti di bawah ini.



<b:widget id='HTML4' locked='false' title='Fan Facebook' type='HTML'> <b:includable id='main'><b:if cond='data:blog.pageType == &quot;item&quot;'><!-- 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>

9. Selesai. Simpan Template blog anda.


Catatan : Huruf yang berwarna biru adalah Kode yang ditambahkan. Ingat satuhal, penempatannya jangan salah yah. Harus pas. Kalao gak pas, maka eror. Untuk mengantisipasinya, sebaiknya sebelum memulai langkahlangkah di atas, Simpan Template Blog anda terlebih dahulu.

Komentar

Posting Komentar

Postingan populer dari blog ini

Cara mengatur jumlah posting pada label

5 Trik melindungi TELEVISI anda dari sambaran petir

Cara membuat blog di blogger.