Cara Membuat Popular Post Bergerak pada Blogger

Waduuuh, jaman sekarang perkembangan teknologi emang sudah sangat pesat sekali. Banyak anak-anak Indonesia yang masih duduk dibangku SD sudah bisa membuat blog yang sangat manis tampilannya.
Bukan hanya dari templatenya, bahkan widget yang digunakan sudah canggih-canggih. Salah satunya yaitu popular post. Bawaan dari blogger popular postnya diam ditempat, tapi diblog yang saya kunjungi beberapa waktu lalu popular postnya bergerak keatas. Seperti apa caranya???
Disini saya akan sedikit memberikan tutorial Cara Membuat Popular Post Bergerak pada Blogger

Langkah-langkahnya :

1. Pastikan kalian sudah punya gadget Popular post, jika belum punya silahkan buat dahulu.
2. Apabila gadget sudah punya maka langkah selanjutnya yaitu masuk pada template>edit html cari kode berikut

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

sudah ketemu???

Pastekan kode dibawah ini setelah kode di atas :

<marquee align='left' direction='up' height='140' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='3' width='100%'>

Setelah itu cari dibawahnya lagi kode </ul>, dan masukan kode dibawah ini tepat sebelum/diatas kode </ul> tersebut.

</marquee>

Begini jadinya :

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

Kamu juga bisa mengganti tinggi dari widget kamu, dan kecepatan gerakannya. Silahkan berexplorasi sendiri dengan karya kalian. Demikian artikel tentang Cara Membuat Popular Post Bergerak pada Blogger. Semoga bermanfaat

Share :

Tweet

More

Related Post