Cara buat post populer dengan efek Marquee

Cara buat post populer dengan efek Marquee yang berpungsi Untuk membuat seluruh post populer berputar keatas dari awal hingga akhir dan selalu berulang ulang' tentu nya dengan sedikit menambahkan efek Marquee ini dapat mempercatik tampilan blog kita oke kita langsung aja bagai mana cara membuat nya

Dibawah ini adalah cara membuat nya
1.Longin ke blogger
2.Dasbor
3.klik rancangan/tata letak
4.add Gadget
5.pilih atau tambahkan popular post
6.Simpan

Dan dibawah ini cara selanjutnya
1.Pilih rancangan Design
2.klik edit HTML
3.centang kotak  Expand Template Widget

 Cari kode: ]]></b:skin>
 1.Letakan kode dibawah ini  Tepat diatas kode ]]></b:skin>
 

.popular-posts ul{
      margin:0;
      padding:0 5px 0 5px;
}
.popular-posts li{
      margin:0;
      padding:0;
}
.popular-posts .item-thumbnail a img{
      width:70px !important;
      height:70px !important;
      border:1px solid #eee;
      padding:4px;
      background:#aaa;
      border-radius:5px;
      box-shadow:2px 2px 2px #000;
      margin:0 6px 5px 0;
} 

Kemudian Cari Kode seperti di bawah ini:

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

Kemudian letaka Kode dibawah ini Tepat dibawah Kode No 2 diatas

<div style='height:225px;width:98%;border:1px solid #666;border-top-width:15px;border-bottom-width:15px;border-radius:5px;box-shadow:0 0 8px #000;margin:10px auto;padding-top:10px;'>
<marquee direction='up' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>

kemudian cari Kode seperti dibawah ini

3.<b:include name='quickedit'/> </div>

Kemudian Tambahkan Kode dibawah ini  Tepat dibawah kode No3.diatas

</marquee>
</div>

Dan dibawah ini hasil dari susunan nya

<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='height:225px;width:98%;border:1px solid #666;border-top-width:15px;border-bottom-width:15px;border-radius:5px;box-shadow:0 0 8px #000;margin:10px auto;padding-top:10px;'>
<marquee direction='up' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' width='100%'>
  <div class='widget-content popular-posts'>
    <ul>
      <b:loop values='data:posts' var='post'>
      <li>
        <b:if cond='data:showThumbnails == "false"'>
          <b:if cond='data:showSnippets == "false"'>
            <!-- (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 == "false"'>
            <!-- (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 style='clear:both;'/>

              <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>
</marquee>
</div>
</b:includable>
</b:widget>

Semoga bermanfaat