Karena Behubung saya lumayan baik . . hehe
saya share ni . .

Membuat Widget Popular Post Menggunakan Scroll | Tutorial Blog

• Login ke Blogger, Klik Design/Rancangan > Edit HTML.
  
• Beri tanda centang pada Expand Template Widget.
  
  Tips : Biasakan mendownload template untuk membackup template sebelum di edit.
• Cari kode
  <div class='widget-content popular-posts'>

  atau

  popular-posts

  atau

  popularposts
  Karena setiap template berbeda, jadi intinya cari kode popular posts yang ada di template Anda.
• Lalu tambahkan kode
  <div style='overflow:auto; width:ancho; height:200px;'>

  </div>
  Untuk lebih jelasnya perhatikan kode berikut :
  Kode :
  

  <b:widget id='PopularPosts1' locked='false' title='Popular Posts' 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;'>

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

  <div>

  <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>

  </div>

  </b:loop>

  </div>

  </b:includable>

  </b:widget>
  Ket : <div style='overflow:auto; width:ancho; height:200px;'> dan </div> adalah kode yang di tambahkan.
• Terakhir klik Save / Simpan Template.
  
  Selesai...