07 Juni, 2012

Cara buat web gratis

Cara buat web gratis

Slide down random post

Posted: 06 Jun 2012 10:26 PM PDT

Satu lagi pengembangan fitur slide show terbaru dari saya. Fitur ini saya beri nama "Slide down random post", sebab fitur ini saya adopsi dan saya kembangkan dari aplikasi recent post yang tampil secara random.

Secara tampilan memang sederhana, tapi Slide down random post ini menurut saya tetap tampil menarik. Dan yang terpenting Slide down random post ini sangat praktis dan efisien.
Jadi sekali pasang, fitur ini tetap menampilkan gambar-gambar dari setiap posting terbaru anda. Dengan catatan, setiap posting anda harus memberi gambar yang nantinya muncul di Slide down random post ini.

Secara ideal untuk Slide down random post ini, dianjurkan gambar yang anda gunakan pada setiap posting berukuran " 600px X 300px " atau skala " 6 : 3 ". Hal ini dimaksudkan agar gambar tampil sesuai dengan aslinya.

Trik ini termotifasi oleh sobat-sobat saya masih merasa kesulitan ketika edit HTML dan masalah itu juga pernah saya alami dulu. Ketika kita sangat menginginkan slide show dipasang di blog yang kita memiliki, kitapun harus lama-lama bergelut dengn kode-kode yang terkadang hasilnya tidak sesuai dengan yang kita inginkan atau bahkan terkadang malah rusak dan tidak bekerja.

Nah..., akhirnya sekarang andapun bisa memanfaatkan Slide down random post ini. Dan anda tidak harus ribet lagi dengan edit ini dan itu.... Anda hanya tinggal memasukkan ULR blog anda, maka sudah siap langsung dipasang pada gadget blog anda.

OK..., bila anda berminat, Langsung saja silahkan anda copy kode dibawah ini, dan anda masukkan pada gadget anda.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script> <script language='JavaScript'> imgr = new Array(); showRandomImg = true; thumbwidth = 60; thumbheight = 60; acolor = "#012EB0"; aBold = false; text = "comments"; showPostDate = true; numposts = 10; home_page = "DISINI ULR BLOG ANDA"; limitnoer=2 intervalnoer=4000 </script>  <div id="cbwg-slide-show-random-post"> <div id="noerlist"> <script type='text/javascript'> //<![CDATA[ jQuery(function(){jQuery("ul.noer").simplenoer(limitnoer,intervalnoer).bind("mouseenter",function(){jQuery(this).trigger("stop")}).bind("mouseleave",function(){jQuery(this).trigger("start")})});(function(e){e.fn.simplenoer=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="noerWrapper" />').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="noer">');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 xy=["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=xy[e];break}}var n=(showPostDate)?'<i><font color="'+acolor+'">'+u+" "+h+" "+t+"</font></i>":"";g=(aBold)?"<b>"+g+"</b>":g;var v='<li><img src="'+img[o]+'" width="'+thumbwidth+'" height="'+thumbheight+'" class="recent-thumb"/><div class="noerlink"><a href="'+p+'" class="recent-link">'+g+'</a></div><div class="postsummary"><i>'+s+'</i></div><div class="noerdate">'+n+'</div><span class="noercomment">'+cmtext+"</span>";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> </div>   <style type="text/css" media="screen">  </style>

Catatan:

Ganti teks "DISINI ULR BLOG ANDA", dengan ULR blog anda.
Fitur ini menggunakan jquery 1.3.2, yang bentuknya seperti berikut:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>

Biasanya bila template anda sudah ada atau sudah menggunakan script tersebut, maka kemungkinan besar Slide down random post ini tidak bekerja.
Bila terjadi masalah tersebut, ada solusi lain yang mungkin bisa anda gunakan, yaitu gunakan satu saja jquery 1.3.2 tersebut dan letakkan didalam atau diantara tag head.

OK... Selamat mencoba dan Semoga bermanfaat....
Jangan lupa luangkan waktu untuk beri komentar dengan menggunakan nama anda yang benar ya......agar saya bisa merespon komentar anda dengan baik.

Anda juga bisa berlangganan artikel-artikel terbaru dari saya, silahkan anda gunakan tombol berlangganan artikel yang ada disebelah kanan halaman ini, atau melalui tombol dibawah ini.

Tidak ada komentar:

Posting Komentar

Langganan: Posting Komentar (Atom)