Cara Membuat Popular Post/Entri Populer dengan Fungsi Scroll

, ,
Ping
Jika pada posting sebelumnya bang germo posting tentang

Cara Membuat Label Dengan Fungsi Scroll Pada postingan kali ini saya akan membahas Cara Membuat Popular Post/Entri Populer dengan Fungsi Scroll. Pada dasarnya caranya sama dan kode yang di gunakan pun juga sama, hanya penempatan kodenya saja yang berbeda.

Dibawah ini adalah screenshot pada saat posting ini saya tulis:




Bagi sobat yang ingin menampilkan widgat Arsip / Daftar isi dengan fungsi scroll silahkan ikuti berikut ini:
  1. Login terlebih dahulu mengunakan akun bloger
  2. Buatlah Entri Populer/Populer Post dengan menambah Gadget pada sidebar, beri nama dengan "Populer Post" ( bisa diganti sesuai keingian ).
  3. Simpan/save. sampai disini anda telah membuat Entri Populer/Populer Post ( tanpa fungsi scroll ).
  4. Utuk menambahkan fungsi scroll pada Arsip Sekarang tuju Tata letak -- -->>Edit HTML.
  5. Beri tanda centang pada Expand Template Widgets.
  6. Cari Populer Post yang sudah di buat tadi, dengan CTRL+F dan ketikkan kata “Populer Post”, ( biasanya di pojok kanan bawah ). akan muncul kode hatml 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 == &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>
    </ul>
    <b:include name='quickedit'/>
    </div></div>
    </b:includable>
    </b:widget>

  7. Letakkan Kode berikut ini <div style='overflow:auto; width:ancho;height:200px;'> sebelum kode <div class='widget-content popular-posts'>


8. Letakkan Kode berikut Sebelum kode </b:includable>

</div>


9. Perhatikan tulisan berwarna merah di atas, kode itulah yang harus disisipkan kedalam
arsip yang telah dibuat, sedangkan tulisan yang berwarna biru pada height:200px;
adalah ukuran tinggi pada fungsi scroll ( ganti angka 200 sesuai dengan keinginan )
10. Simpan template dan lihatlah hasilnya

Demikian tulisan bang germo tentang cara membuat Post/Entri Populer dengan Fungsi Scroll

10 comments:

Web-Merdeka said...

wah mantap gannn infonya..

gadogadosemarang.co.cc said...

manjuuur gan..

Arief charing sentre Free download sofware dan siraman rohani islam said...

gak bisa gan gimana ya

Your Solution said...

sipp gan,,thanks..

mayastaku said...

Terima kasih infonya gan.

Salam kenal ....

dimas setiawan said...

makasih infonya gan...

andracopo said...

nice infoh gan...!!!
mampir ke lapak gw jg y gan...
http://andracopo.blogspot.com/

gopar-it said...

wah muter2 trnyata dpet disini jg,,thanks sob infonya,,visit back http://gopar-gt.blogspot.com

d3t3ct1v3c0d3n3t said...

saya nyari script popular post berdasarkan view blog .. ada enggak mas.?

Rafly Liputo said...

mantap, izin sedot mas bro.

sudah di follow, di tunggu follow back nya mas bro di http://raflyliputo.blogspot.com

Post a Comment

Gajah mati boleh meninggalkan gading, Harimau mati meninggalkan belang,Tetapi janganlah Anda pergi dengan meninggalkan SPAM komentarlah yang baik secara otomatis anda akan mendapatkan backlink dari link komentar Dofollow saya !

BackLink

BackLink !!!!