Bagi anda yang ingin tau bagai mana cara, membuat label dengan fungsi Scroll pada postingan, kali ini
" Siphe " akan membahasnya...sebagai contoh bisa anda
lihat gambar disamping ini, dengan menggunakan fungsi Scroll isi dari Label Paling Laris bisa ditampilkan secara maksimal sejumlah 10 buah......sehingga dengan fungsi Scroll yang telah ditambahkan kedalam.
Blog untuk Label Paling Laris tidak memakan banyak tempat untuk tinggi rendahnya Fungsi Scroll bisa anda atur sesuai dengan selera anda....untuk jelasnya silahkan ikuti langkah berikut:
- Login terlebih dahulu mengunakan akun bloger anda.
- Buatlah Entri Populer/Populer Post dengan menambah Gadget pada sidebar, beri nama dengan "Populer Post" ( bisa diganti sesuai selera ). Kalau diblog "Siphe" menggunakan nama Paling Laris
- Setelah itu simpan/save. selesai sudah anda telah membuat Entri Populer/Populer Post ( ingat tanpa menggunakan fungsi scroll ).
- Utuk menambahkan fungsi scroll pada Arsip Sekarang pilih atau klik Rancangan >> Edit HTML.
- Beri tanda centang pada Expand Template Widgets. ( Jangan lupa Didownload Template Fullnya ya...biar aman apabila terjadi kesalahan saat pengeditannya..
- Coba anda cari Populer Post yang sudah anda buat tadi, agar lebih cepat dalam pencariannya silahkan gunakan "CTRL+F" dan ketikkan kata “Populer Post”, ( biasanya di pojok kanan bawah ). akan muncul kode HTML seperti di bawah ini:
<b:widget id='PopularPosts1' locked='false' title='Galery Populer' 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;'>
<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 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></div>
</b:includable>
</b:widget>
- Silahkan anda letakkan kode berikut ini <div style='overflow:auto; width:ancho;height:200px;'> sebelum kode
- <div class='widget-content popular-posts'>
- Selanjutnya anda letakkan kode berikut sebelum kode
- </b:includable>
</div>
- Tolong diperhatikan untuk tulisan berwarna Biru di atas, kode itulah yang harus disisipkan kedalam arsip yang telah dibuat, sedangkan tulisan yang berwarna Coklat pada height:200px;
adalah ukuran tinggi pada fungsi scroll ( ganti angka 200 sesuai dengan selera anda ) - Semoga bermanfaat...............Ngihui......
Tags:
Belajar BLOG