Cara membuat Populart Post scroll automatis pada blog





Cara membuat Populart Post scroll automatis berjalan pada blog 

Hai teman bloggers semua,pada kesempatan malam kali ini ,blog ini akan update artikel menarik untuk teman bloger semua,

Yang di mana pada postingan kali ini akan membahas mengenai sebuah recent post atau lebih di kenal dengan populart post pada blog blogger.

Populart post  automatis scroll yang di sajikan disini tentunya mempunyai suatu keunikan daripada yang biasanya.

Karena populart post kali ini bisa berjalan secara otomatis ,sendiri ke bawah,Kayak ada yang scroll nya ke,Ini akan terlihat sangat indah bila di pasangkan pada blog anda.

Karena popular post seperti ini sama halnya dengan menu sticky yang berpenampilan tampil beda dengan dukungan kode html dan javascript tentunya.

Baiklah pada postingan yang membahas cara membuat populart post scroll automatis pada blog dapat anda lakukan dengan menggunakan script sebagai berikut:


Cara Membuat populart,Recent post Scroll Automatis Berjalan ke bawah Pada Blog Blogger

Cara ini mungkin sudah banyak di lakukan untuk menghasilkan tampilan blog yang lebih keren dari yang biasanya,dengan memasang beberapa kode html/script ,popular post pada blog anda akan bisa berjalan sendiri dengan tampilan thumbanil dan judul postingan secara teratur.berikut tutorialnya:
  • Pertama silahkan buka dasbhord blogger
  • Klik layout dan add gadget
  • Klik tambah gadget dan pilih mode Html/JavaScript
  • dan pastekan kode di bawah ini

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>
<style type="text/css" media="screen">
<!--
#spylist {
overflow:hidden;
margin-top:5px;
padding:0px 0px;
height:350px;
}
#spylist ul{
width:355px;
overflow:hidden;
list-style-type: none;
padding: 0px 0px;
margin:0px 0px;
}
#spylist li {
width:335px;
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 = 300;
cellspacing = 6;
borderColor = "#232c35";
bgTD = "#000000";
thumbwidth = 60;
thumbheight = 60;
fntsize = 12;
acolor = "#666";
aBold = true;
icon = " ";
text = "Reply(s)";
showPostDate = false;
summaryPost = 40;
summaryFontsize = 10;
summaryColor = "#666";
icon2 = " ";
numposts = 10;
home_page = "https://inajesense.blogspot.com/";
limitspy=5
intervalspy=6000
</script>
<div id="spylist">
    <script type='text/javascript'>
//<![CDATA[
 /*
 * Script dikombinasikan dari bloggerstricks.com
 * spy effect dari jqueryfordesigners.com
 * Oleh Abu Farhan (www.abu-farhan.com)
 * Modifikasi oleh buka-rahasia.blogspot.com
 */
jQuery(function(){jQuery("ul.spy").simpleSpy(limitspy,intervalspy).bind("mouseenter",function(){jQuery(this).trigger("stop")}).bind("mouseleave",function(){jQuery(this).trigger("start")})});(function(e){e.fn.simpleSpy=function(f,g){f=f||4;g=g||5000;return this.each(function(){var l=e(this),k=true,i=[],m=f,o=0,h=l.find("> li:first").height();l.find("> li").each(function(){i.push("<li>"+e(this).html()+"</li>")});o=i.length;l.wrap('<div class="spyWrapper" />').parent().css({height:h*f});l.find("> li").filter(":gt("+(f-1)+")").remove();l.bind("stop",function(){k=false}).bind("start",function(){k=true});function n(){if(k){var p=e(i[m]).css({height:0,opacity:0,display:"none"}).prependTo(l);l.find("> li:last").animate({opacity:0},1000,function(){p.animate({height:h},1000).animate({opacity:1},1000);e(this).remove()});m++;if(m>=o){m=0}}setTimeout(n,g)}n()})}})(jQuery);function showrecentposts(z){document.write('<ul class="spy">');j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var o=0;o<numposts;o++){var w=z.feed.entry[o];var g=w.title.$t;var f;var p;if(o==z.feed.entry.length){break}for(var l=0;l<w.link.length;l++){if(w.link[l].rel=="alternate"){p=w.link[l].href;break}}for(var l=0;l<w.link.length;l++){if(w.link[l].rel=="replies"&&w.link[l].type=="text/html"){f=w.link[l].title.split(" ")[0];break}}if("content" in w){var r=w.content.$t}else{if("summary" in w){var r=w.summary.$t}else{var r=""}}postdate=w.published.$t;if(j>imgr.length-1){j=0}img[o]=imgr[j];s=r;a=s.indexOf("<img");b=s.indexOf('src="',a);c=s.indexOf('"',b+5);d=s.substr(b+5,c-b-5);if((a!=-1)&&(b!=-1)&&(c!=-1)&&(d!="")){img[o]=d}cmtext=(text!="no")?'<i><font color="'+acolor+'">('+f+" "+text+")</font></i>":"";var q=[1,2,3,4,5,6,7,8,9,10,11,12];var x=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var u=postdate.split("-")[2].substring(0,2);var h=postdate.split("-")[1];var t=postdate.split("-")[0];for(var e=0;e<q.length;e++){if(parseInt(h)==q[e]){h=x[e];break}}var n=(showPostDate)?'<i><font color="'+acolor+'"> ('+u+" "+h+" "+t+")</font></i>":"";g=(aBold)?"<b>"+g+"</b>":g;var v='<li><a href="'+p+'"><img src="'+img[o]+'" width="'+thumbwidth+'" height="'+thumbheight+'" class="recent-thumb"/></a><a href="'+p+'" class="recent-link">'+g+'</a><div class="spydate">'+n+'</div><div class="spycomment">'+cmtext+"</div>";document.write(v);j++}document.write("</ul>")}document.write('<script src="'+home_page+"feeds/posts/default?max-results="+numposts+'&orderby=published&alt=json-in-script&callback=showrecentposts"><\/script>');
//]]>
</script>
</div>


Keterangan:

cara menempatkan dan hal yang perlu di gantikan sebelum memasang kode script populart post automatis berjalan scroll pada blog ini,Silahkan ganti tulisan yang berwarna merah dengan tulisan anda:
  • Warna merah url https://inajesense.blogspot.com/ Di ganti dengan url alamat blog anda
  • limitspy:Silahkan di ganti angka 5 dengan angka yang di inginkan,Ini untuk merubah berapa kecepatan scroll yang ingin di tampilkan.
  • Reply(s) dapat di ganti dengan coment,atau Komentar 
  • 300 silahkan di ganti dengan ukuran yang di inginkan .Dan silahkan di kreasikan lagi sesuai keinginan anda,Misalkan seperti ukuran thumbanil,Jumlah post yang di crawl yang ada hanya 40 postingan,
  • Ubah sesuai keinginan anda mulai dari widht dan height.
  • http://i879.photobucket.com/albums/ab351/bloggerblogimage/blogger/post.jpg silahkan di ganti dengan url gambar blog kalian,Atau bisa menghapusnya saja.

Nah jika sudah,silahkan pasang di widget dan lihat hasilnya,Apabila tidak bisa berjalan mungkin ada yang terlalu berlebihan biasanya dalam jumlah postingan yang akan di tampilkan,Script ini saya dapatkan dari blog tetangga ,hehe .lumayan script ini ternyata masih berfungsi juga.

Dengan menggunakan script populer post berjalan ini bisa membuat blog semakin cantik dan keren sekali.



Artikel Terkait

Postingan populer dari blog ini

Cara Mengatasi Gagal Install Driver VGA Pada windows 7 All version

Begini Cara Memasang iklan penelusuran bersponsor google adsense Di Blog

Membuat Related Post Grid Untuk Template AMP Blogger

Cara Membuat Akun Google Adsense Hosted Terbaru

Koleksi Symbol Text Keren Untuk Blog Dan Sosial Media

Cara membuat Link Model no follow dan Do follow

Tutorial Full Flash Smartphone OPPO A37 ,Lupa Pola

Cara Menampilkan Traffic Data Koneksi Internet Pada Laptop

Kumpulan Kode Html Javascript Untuk Edit Tampilan Blog

9 Jaringan Ads CPC CPM Alternatif Google Adsense Terbaik 2109 Yang Perlu Di coba