Sabtu, 17 Maret 2012

Cara Membuat Recent Post Berjalan


By on 20.18

Cara Membuat Recent Post Berjalan - Kali ini saya akan membahas Tutorial Blog dan Tips Blog yaitu Cara Membuat Recent Post Berjalan sebelumnya saya pernah bahas tentang cara membuat recent post dengan Thumbnail atau gambar, nah sekarang beri sedikit efek, yaitu efek berjalan dari atas ke bawah, jadi berjalan gitu recent post nya, owh iya bagi yang tidak tahu apa itu recent post saya akan jelaskan Recent Post adalah Artikel Terbaru jika kita memasang widget Recent Post maka artikel terbaru kita akan ditampilkan di sidebar blog, jadi fungsinya memudahkan pengunjung melihat artikel terbaru Blog kamu, sehingga akan menambah minat membaca pengunjung. Ok langsung saja cara membuat Recent Post Berjalan.




  • Login ke Blog kamu.
  • Pilih Add Gadget HTML Java Script.
  • Copy kode di bawah ini.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript">
</script>
<style media="screen" type="text/css">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:220px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:208px;
padding: 5px 5px;
margin:0px 0px 5px 0px;
list-style-type:none;
float:none;
height:70px;
overflow: hidden;
background:#fff url(http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg) repeat-x;
border:1px solid #ddd;
}
#spylist li a {
text-decoration:none;
color:#4B545B;
font-size:11px;
height:18px;
overflow:hidden;
margin:0px 0px;
padding:0px 0px 2px 0px;
}
#spylist li img {
float:left;
margin-right:5px;
background:#EFEFEF;
border:0;
}
.spydate{
overflow:hidden;
font-size:10px;
color:#0284C2;
padding:2px 0px;
margin:1px 0px 0px 0px;
height:15px;
font-family:Tahoma,Arial,verdana, sans-serif;
}
.spycomment{
overflow:hidden;
font-family:Tahoma,Arial,verdana, sans-serif;
font-size:10px;
color:#262B2F;
padding:0px 0px;
margin:0px 0px;
}
-->
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[1] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[2] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[3] = "http://i43.tinypic.com/orpg0m.jpg";
imgr[4] = "http://i43.tinypic.com/orpg0m.jpg";
showRandomImg = true;
boxwidth = 255;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 70;
thumbheight = 70;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "comments";
showPostDate = true;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 20;
home_page = "http://blazerracing.blogspot.com/";
limitspy=4
intervalspy=4000
</script>
<div id="spylist">
<script src="http://infonetmu.googlecode.com/files/recentpostthumbslideshow.js" type="text/javascript">
</script></div>
Keterangan :
Ganti URL yang berwarna merah dengan Alamat Blog kamu.
numposts adalah jumlah recent post yang akan ditapilkan.

Sekian penjelasan dari saya, jika ada hal yang kurang paham silahkan tinggalkan pesan di kotak komentar.

About Syed Faizan Ali

Faizan is a 17 year old young guy who is blessed with the art of Blogging,He love to Blog day in and day out,He is a Website Designer and a Certified Graphics Designer.

37 komentar:

  1. thanks info
    http://googletrendi.blogspot.com/
    http://vaioz.reviewthink.com/

    BalasHapus
  2. wah ganti gambarnya gimana ya gan?

    BalasHapus
  3. @didySinchan : wah sob ga bisa diganti, soalnya udah kayak gitu, gambar nya disesuaikai sesuai posting nya.kalau posting gambar nya gitu ya nanti muncul nya gitu.

    BalasHapus
  4. infonya mantap gan...wajib dicoba

    BalasHapus
  5. Makacih..

    By"
    http://hack-komputer999.blogspot.com/

    BalasHapus
  6. Halo sobat,
    Setelah saya coba, ternyata gambarnya seperti saling bertindih. Kenapa ya sob.
    Thanx.

    http://www.bataica.com

    BalasHapus
  7. @Patuan Naraja : Hmm setelah saya lihat di Blog ente ga tuh semua nya baik-baik aja, cuma lebar nya ga sesuai coba ganti widht:220px jadi widht:auto supaya sesuai

    BalasHapus
  8. Sangat bermanfaat bro.

    Kunjungi blog ane ya bro :D
    http://wahyoemsc.blogspot.com/

    BalasHapus
  9. tips yg bermanfaat...
    makasih gan, jgn lups kunjungi blog saya juga ya :)

    BalasHapus
  10. gan kok gak bisa brjalan (slideshow) punya saya. mohon bantuannya. cek di blog saya

    BalasHapus
  11. @Thiew uthiew : sama-sama sob.
    @Bang Huda : mungkin blog sobat memasang fitur Menu Tab View yah, emang gitu kalau pake Menu Tab View suka ga jalan

    BalasHapus
  12. ok ship
    miachintia.blogspot.com

    BalasHapus
  13. infonya keren mas,,,

    andika.blogspot.com

    BalasHapus
  14. Komentar ini telah dihapus oleh pengarang.

    BalasHapus
  15. mkasih bnget infonya ya sangat membantu

    www.ilmailmu.blogspot.com

    BalasHapus
  16. thanks gan. kunjungi balik gan www.os-cyber.com

    BalasHapus
  17. nieee baru mantappp

    visit back www.galedeg.blogspot.com

    BalasHapus
  18. makasih gan,,, akhirnya bisa jga thanks ea...

    ouhh ya,, follow and visit juga blog ane ok...

    tempatdownloadgamekeren.com

    BalasHapus
  19. yes-yes-yes...
    work di blog saya gan....
    thank's..
    silahkan di rievew disini..
    www.bung-klon.blogsot.com

    BalasHapus
  20. thanks atas artikelnya.^_^!

    http://zenbu26.blogspot.com/

    BalasHapus
  21. Thanks sob infonya
    kunjungi http://sauqisyahtia.blogspot.com/

    BalasHapus
  22. kok di blog saya ga bisa ya @@~ loadingnya jadi lama dan recent postna ga muncul2, cuma judulnya doang.

    BalasHapus
  23. Untuk loading jadi lambat itu risiko yang harus diterima, namun untuk yang dimaksud agan ga muncul coba cek lagi.

    BalasHapus
  24. mantap artikelnya sob..
    informasi bermanfaat sekali.

    thx udah sharing

    BalasHapus
  25. tanks gan, wah makin mantap blog saya nih
    hehehehe...

    saya juga punya blog nih

    BalasHapus
  26. gan, kq ga auto scroll ya, mohon masukannya ya..

    BalasHapus
  27. Untuk Recent Post berjalan memang ga bisa pake scrol alias harus ditunggu

    BalasHapus
  28. terima kasih banyak gan,semua postingan anda sangat membantu saya selaku newbie blogger. Salam kenal..:)

    BalasHapus
  29. saya akan pasang recent post ini di blogger
    terima kasih tutorialnya

    BalasHapus
  30. Border image recent post nya gak bisa diapa2in lagi ya om.. | Thanks anyway! :)

    Visit us : topspot-official.blogspot.com

    BalasHapus