Membuat Popular Post Bergerak

0
272

Bosen sama Popular post yang monoton, di modif dikit aja gan, supaya menarik pemandangan juga, dengan bergerak secara perlahan ke atas. Untuk Membuat popular posts bergerak..seperti yang terdapat pada blog ane, agan harus memasang widget popular post terlebih dulu. jika popular posts agan sudah terpasang..langsung loncat aja ke Langkah 4.
sekarang bagi yang belum pasang popular post, ikutin cara dibawah ini ya.
Caranya :

1. Masuk ke Design-Page Elements

design

2. Kemudian pilih add a gadget

add a gadget

3. Klik popular post

popular

4. Sesudah widget tersebut berhasil dipasang

  • Ke design template
  • Ke edit HTML
  • Centang pada expand template widget

cari kode seperti dibawah ini:

<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 class='widget-content popular-posts'>
<ul>
<marquee align='left' direction='up' height='140' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='3' width='100%'>
<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>
</marquee> </ul>
<b:include name='quickedit'/></div>
</div>
</b:includable>
</b:widget>

INFO :

  • Text warnaHijau=Kode yang Dicari
  • Text warnaMerah=Kode yang Ditambahkan
  • Scrollamount= Kecepatan Bergerak slide (nilai 1 adalah nilai untuk yang paling lambat)
  • Heightukuran Tinggi widget, jadi dari nilai 140 bisa di ubah sesuai kebutuhan

Previous articleTool Buat Detech .Net Framework
Next articleFix error Install .Net Framework 4