Senin, 24 Januari 2011
Membuat Widget Hanya Tampil di Halaman Tertentu
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='' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.homepageUrl == data:blog.url'>
<!-- 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 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 == "item"'> dan </b:if> seperti dibawah ini.
<b:widget id='HTML1' locked='false' title='' 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 , karena widget itu hanya tampil pada halaman postingan di blog ini. Cukup mudah bukan? Selamat mencoba dan semoga bermanfaat.
Label:
tutorial blog