Jumat, 30 November 2012

Cara Menampilkan Widget di Halaman Terentu

Tutorial Blogspot : Cara Menampilkan Widget di Halaman Terentu

Widget merupakan komponen tambahan blogspot, di sini kita akan mencoba mengatur tampilan widget. Di mana widget diatur sedemikian rupa sehingga hanya tampil pada halaman tertentu.

Halaman yang dimaksud adalah halaman yang ada dalam blogspot seperti, halaman utama, halaman label, halaman arsip, halaman page dan halaman postingan. Sedangkan widget di sini bisa berupa widget HTML, widget label, widget popular post, widget recent post,  dan masih banyak widget lainnya.

Berikut ini cara menampilkan widget dihalaman tertentu , sebelum memulai mengedit HTML, sebaiknya backup template untuk berjaga terhadap hal yang tidak diinginkan.

1. Login ke dashboard blogger.
2. Pilih Rancangan dan klik edit HTML
3. Beri tanda centang pada tulisan Expand Template Widget
4. Lalu cari kode widget yg akan di tampilkan pada halaman tertentu.  Misalnya kita ingin mengatur tampilan widget “Random Post” tinggal cari dengan menggunakan F3. Jika kita tidak tahu nama widget tersebut, tinggal masuk di tata letak dan klik edit pada widget yang akan kita atur tampilannya. Di bagian url widget tadi aka ada keterangan widget tersebut jenisnya apa. Seperti widget Random Post jenisnya adalah widget HTML1, jadi kode widget random post bisa diketahui dengan mencari menggunakan F3 dengan kata kunci HTML1.



<b:widget id='HTML1' locked='false' title='Random Post' 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>


Agar widget tersebut dapat tampil di halaman yang kita kehendaki maka harus kita tambah dengan kode yang berwarna biru berikut


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

Hasilnya akan seperti ini.

<b:widget id='HTML1' locked='false' title='Random Post' 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:if>
<b:include name='quickedit'/>
</b:includable>
</b:widget>


Berikut ini screenshot jika kita mencari widget yang tidak diketahui melalui menu tata letak. Perhatikan nama widget ini ShareThis dan tipe widget adalah HTML4 (perhatikan gambar sudut kanan atas).



mengatur tampilan widget

Berikut ini beberap format  memasukkan kode seperti di contoh di atas untuk mengatur widget tampil di bagian tertentu :

1. Menampilkan widget hanya pada 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 pada 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 hanya di halaman posting.
<b:if cond='data:blog.pageType == &quot;item&quot;'>
......................................................
</b:if> 

6. Menampilkan widget di semua halaman, kecuali halaman posting.
<b:if cond='data:blog.pageType != &quot;item&quot;'>
 ......................................................
</b:if> 

7. Menampilkan widget hanya pada halaman staticpages.
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
......................................................
</b:if> 

8. Menampilkan widget di semua halaman,kecuali halaman staticpages.
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
......................................................
</b:if> 

9. Menampilkan widget hanya pada postingan tertentu saja.
<b:if cond='data:blog.pageType == &quot;alamat-postingan&quot;'>
......................................................
</b:if> 

10. Menampilkan widget selain di postingan tertentu.
<b:if cond='data:blog.pageType != &quot;alamat-postingan&quot;'>
......................................................
</b:if> 

Tidak ada komentar:

Posting Komentar