Membuat Entri Populer di Blog dengan Scroll

1. Login ke blogger.com lalu klik design/Tata Letak/Rancangan

2. Klik Edit HTML

3. Beri tanda centang pada Expand Template Widgets.

4. Cari kode 'Entri Populer' (agar cepat, tekan CTRL F di Keyboard) kan muncul kode hatml seperti di bawah ini:

<b:widget id='PopularPosts1' locked='false' title='Galery Populer' type='PopularPosts'>

<b:includable id='main'>

<b:if cond='data:title'><h2><data:title/></h2></b:if>

<div style='overflow:auto; width:ancho;height:200px;'>

<div class='widget-content popular-posts'>

<ul>

<b:loop values='data:posts' var='post'>

<li>

<b:if cond='data:showThumbnails == &quot;false&quot;'>

<b:if cond='data:showSnippets == &quot;false&quot;'>

<!-- (1) No snippet/thumbnail -->

<a expr:href='data:post.href'><data:post.title/></a>

<b:else/>

<!-- (2) Show only snippets -->

<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>

<div class='item-snippet'><data:post.snippet/></div>

</b:if>

<b:else/>

<b:if cond='data:showSnippets == &quot;false&quot;'>

<!-- (3) Show only thumbnails -->

<div class='item-thumbnail-only'>

<b:if cond='data:post.thumbnail'>

<div class='item-thumbnail'>

<a expr:href='data:post.href' target='_blank'>

<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>

</a>

</div>

</b:if>

<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>

</div>

<div style='clear: both;'/>

<b:else/>

<!-- (4) Show snippets and thumbnails -->

<div class='item-content'>

<b:if cond='data:post.thumbnail'>

<div class='item-thumbnail'>

<a expr:href='data:post.href' target='_blank'>

<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>

</a>

</div>

</b:if>

<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>

<div class='item-snippet'><data:post.snippet/></div>

</div>

<div style='clear: both;'/>

</b:if>

</b:if>

</li>

</b:loop>

</ul>

<b:include name='quickedit'/>

</div></div>

</b:includable>

</b:widget>

5.  Letakkan Kode berikut ini <div style='overflow:auto; width:ancho;height:200px;'> sebelum kode <div class='widget-content popular-posts'>


6. Letakkan Kode berikut Sebelum kode </b:includable>

</div>

7. Perhatikan tulisan berwarna merah di atas, kode itulah yang harus disisipkan kedalam
arsip yang telah dibuat, sedangkan tulisan yang berwarna biru pada height:200px;
adalah ukuran tinggi pada fungsi scroll ( ganti angka 200 sesuai dengan keinginan )

8. Simpan template dan lihatlah hasilnya....




Sumber :