Untuk membuat popular posts bergerak seperti mana terdapat diblog ini ,anda mestilah memasang widget popular post terlebih dahulu.Jika sudah dipasang terus sahaja ke langkah 4.
Caranya :
1.Masuk ke dashboard-Layout---add a gadget
2.Ambil popular post
Sesudah widget tersebut dipasang
3.Seterus pada dashboard pilih template--edit HTML
cari kod 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'>
<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 == "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 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>
kod berwarna merah perlu ditambah seperti diatas <b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content popular-posts'>
<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 == "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 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>
kemudian simpan template anda
Kelajuan boleh diubah pada scrollamount='3'.>ubah nilai 1 paling perlahan
update 9/5/2013



Catat Ulasan
Letakkan komen anda disini.Segala komen adalah dihargai.Sila buat backup bila membuat perubahan pada template.Terima Kasih.
28 Comments:
tak berjaya buatla
Saya dah letak semua yang yahaya ajar tapi kenapa apabila saya marquee sebelum ul ia keluar error. plsss yahaya
tak jadi pun.... huhuhu
aha la... tak jadi pun.... tak keluar text...
kenapa error semasa saya letak marquee sebelum ul, plss
ada masalah la bro bila nak save keluar error pulak
@awie958
saya salah letak kod akhir</marquee> diatas sudah dibetulkan.harap maaf pada semua....
macam mana nak perlahankan sikit pergerakkannya,laju sgt lah....tq
@ct N honeylihat pada baris akhir tutorial
ok dah berjaya....timakaseh bro...
x boleh asyik error je
kod berwarna merah perlu ditambah disini tu ap mak sudnye...tak faham la..(^_^)
@aDD??kalau error salah letak atau kod tak lengkap.
@hoyahadissaya dah edit dan tunjukkan semua kod.Harap isnya dpt membantu
saya ske..jadi2 ^_^
wah! yg ni la kite cari2 selama nie. thanks fr sharing :))
Templat anda tidak boleh dihuraikan kerana ia tidak purna bentuk. Sila pastikan semua elemen XML ditutup dengan sempurna.
Mesej ralat XML: The element type "marquee" must be terminated by the matching end-tag "". nape erk?
xboleh buat...
thankss . berjaya !
bg spa2 yg x dpt gunakan Ctrl+F untuk cari kod..
OK KALOI tak berjaya huhuhu ^_^
Mekaseh. Saya dh cube.
x jadi pon...hermmm
@chegu abbasmungkin cikgu salah letak kod pada template
informasinya sangat bermanfaat
@Rudy Hartonoterima kasih....:)
CARI KOD APE?..Xkn la nk cari code bnyk tu..
sorry bro memang tutorial nie xmembantu..
@aidil hakimtak perlu cari semua tu...cari kod mula...saja dan tambahkan kod merah padanya.Tujuan saya tunjuk semua kod tu untuk menunjukkkan dimana kod yang perlu ditambah.
terima kasih atas perkongsian :)