Caranya sebagai berikut:
1.Login ke akun blooger anda.
2.Masuk ke doshbor blog anda
3.Klik tab Rancangan dan centang Expan wedget
4.Cari kode ]]></b:skin>
5.Simpan code di bawwah ini di atas code ]]></b:skin>
#carousel{width:960px;height:330px;border:1px solid #386361;position:relative;display:block;background:#e2e2e2 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEim23HCZAlEvV4sJnB8D_nr7hgKfJ8fxY-18UY_xIpTO7dg9YOmJ8vr3wuKzICwPjbovVkvM8PuAlxIijhowujm4Q_lHbkM5h-jt6bfIbfCOQ9iHzUrkfkBTzCIjhBLq5m1XbI9nWKq3Ok/s1600/outer.png) repeat-x top;margin:10px auto;padding:0 auto}
#carousel .container{position:absolute;left:25px;width:920px;height:330px;overflow:hidden}
#carousel #previous_button{position:absolute;width:25px;height:330px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiyMpombQZODRnK6_Y3se3gDLpUnI_8CLFL4gZYonMycIcimkd70PoPdN1_ymFDdi34GYTpD4U8DPB0ALPRf6D6X3ZWExDN6-ozZYfElcVVojUoNxwg4SSgdXmGRxivEhLPdMgJz2jUk4Y/s1600/prev.png) center;z-index:100;cursor:pointer;}
#carousel #next_button{position:absolute;right:0;width:25px;height:330px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhJaE5WW4mEdR9oQ6nZ9PD4JNYHb8yjdN-OzXwymkTsFsspdIr7dZovQE3hZVv_Rntkt3bHAfN8G11CtxVgrFnJgN62I1c56Yc90di-5pKQ4z3kxs6DQNhtccGNDCYhNMnxzQSizKelbLY/s1600/next.png) center;z-index:100;cursor:pointer;}
#carousel #next_button:hover,#carousel #previous_button:hover,#carousel ul li:hover{filter:alpha(opacity=80);opacity:.8}
#carousel ul{width:100000px;position:relative;margin-top:10px}
#carousel ul li{background:#143234 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizzJySsOKv-ZPOmPcqoYRhybKR1TfuV0AfiaMm8eDHXe_3kR_0_njJq9SetLndTxnt4HnQJOZk4_my7OGUsE0Q3168s9tHmdyYzSBf1vog1PFptszEhLU-lWD6OA4CfQQSm9pBcZwlI5Q/s1600/sliderbg.png) repeat-x top;display:inline;float:left;text-align:center;font-weight:700;line-height:1.2em;width:200px;height:300px;margin:0 1px 20px 12px;padding:6px}
#carousel ul li a.slider_title{color:#5ea19d;display:block;margin-top:5px;text-shadow:0 1px 1px #000}
#carousel ul li a.slider_title:hover{color:#f7bc2f}
6.Cari code </head> lalu copy dan simpan code di bawah ini di atas code </head>
<script type='text/javascript'>
//<![CDATA[
imgr=new Array();imgr[0]="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYk6RMB42ntq7_ntqbp8K8TP7GBjPQgJTdAlvOMtdXpEiqtn0yCqwQuOhL6VkekXaEciUV4BtsELSiYuDQH4L5ND2rnmTuKB-oQqTs1sjnKiENQob8jOxxagPBvEoUWXD7heu6M1OUAyK9/s1600/no-video.gif";showRandomImg=true;aBold=true;summaryPost=200;summaryTitle=20;numposts1=12;numposts2=4;function removeHtmlTag(strx,chop){var s=strx.split("<");for(var i=0;i<s.length;i++){if(s[i].indexOf(">")!=-1){s[i]=s[i].substring(s[i].indexOf(">")+1,s[i].length)}}s=s.join("");s=s.substring(0,chop-1);return s}function showrecentposts(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();document.write('<ul>');for(var i=0;i<numposts1;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break}}if("content"in entry){var postcontent=entry.content.$t}else if("summary"in entry){var postcontent=entry.summary.$t}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;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[i]=d;var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break}}var daystr=day+' '+m+' '+y;var trtd='<li class="car"><div class="thumb"><a href="'+posturl+'"><img width="200" height="250" class="alignnone" src="'+img[i]+'"/></a></div><p><a class="slider_title" href="'+posturl+'">'+posttitle+'</a></p></li>';document.write(trtd);j++}document.write('</ul>')}function showrecentposts5(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();for(var i=0;i<numposts1;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break}}if("content"in entry){var postcontent=entry.content.$t}else if("summary"in entry){var postcontent=entry.summary.$t}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;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[i]=d;var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break}}var trtd='<li id="nav-post-'+i+'" class="ui-tabs-nav-item"><a href="#post-'+i+'"><img width="100" height="69" src="'+img[i]+'"/><span>'+posttitle+'</span></a></li>';document.write(trtd);j++}}function showrecentposts1(json){j=(showRandomImg)?Math.floor((imgr.length+1)*Math.random()):0;img=new Array();if(numposts2<=json.feed.entry.length){maxpost=numposts2}else{maxpost=json.feed.entry.length}for(var i=0;i<maxpost;i++){var entry=json.feed.entry[i];var posttitle=entry.title.$t;var pcm;var posturl;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){posturl=entry.link[k].href;break}}for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='replies'&&entry.link[k].type=='text/html'){pcm=entry.link[k].title.split(" ")[0];break}}if("content"in entry){var postcontent=entry.content.$t}else if("summary"in entry){var postcontent=entry.summary.$t}else var postcontent="";postdate=entry.published.$t;if(j>imgr.length-1)j=0;img[i]=imgr[j];s=postcontent;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[i]=d;var month=[1,2,3,4,5,6,7,8,9,10,11,12];var month2=["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];var day=postdate.split("-")[2].substring(0,2);var m=postdate.split("-")[1];var y=postdate.split("-")[0];for(var u2=0;u2<month.length;u2++){if(parseInt(m)==month[u2]){m=month2[u2];break}}var daystr=day+' '+m+' '+y;pcm='<a href="'+posturl+'">'+pcm+' comments</a>';var trtd='<div class="tutorial-onlineku"><h2 class="posttitle"><a href="'+posturl+'">'+posttitle+'</a></h2><a href="'+posturl+'"><img class="tutorial-onlineku_img" src="'+img[i]+'"/></a><div class="clear"></div></div>';document.write(trtd);j++}}var relatedTitles=new Array();var relatedTitlesNum=0;var relatedUrls=new Array();var thumburl=new Array();function related_results_labels_thumbs(json){for(var i=0;i<json.feed.entry.length;i++){var entry=json.feed.entry[i];relatedTitles[relatedTitlesNum]=entry.title.$t;try{thumburl[relatedTitlesNum]=entry.gform_foot.url}catch(error){s=entry.content.$t;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!="")){thumburl[relatedTitlesNum]=d}else thumburl[relatedTitlesNum]='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYk6RMB42ntq7_ntqbp8K8TP7GBjPQgJTdAlvOMtdXpEiqtn0yCqwQuOhL6VkekXaEciUV4BtsELSiYuDQH4L5ND2rnmTuKB-oQqTs1sjnKiENQob8jOxxagPBvEoUWXD7heu6M1OUAyK9/s1600/no-video.gif'}if(relatedTitles[relatedTitlesNum].length>35)relatedTitles[relatedTitlesNum]=relatedTitles[relatedTitlesNum].substring(0,35)+"...";for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel=='alternate'){relatedUrls[relatedTitlesNum]=entry.link[k].href;relatedTitlesNum++}}}}function removeRelatedDuplicates_thumbs(){var tmp=new Array(0);var tmp2=new Array(0);var tmp3=new Array(0);for(var i=0;i<relatedUrls.length;i++){if(!contains_thumbs(tmp,relatedUrls[i])){tmp.length+=1;tmp[tmp.length-1]=relatedUrls[i];tmp2.length+=1;tmp3.length+=1;tmp2[tmp2.length-1]=relatedTitles[i];tmp3[tmp3.length-1]=thumburl[i]}}relatedTitles=tmp2;relatedUrls=tmp;thumburl=tmp3}function contains_thumbs(a,e){for(var j=0;j<a.length;j++)if(a[j]==e)return true;return false}function printRelatedLabels_thumbs(){for(var i=0;i<relatedUrls.length;i++){if((relatedUrls[i]==currentposturl)||(!(relatedTitles[i]))){relatedUrls.splice(i,1);relatedTitles.splice(i,1);thumburl.splice(i,1);i--}}var r=Math.floor((relatedTitles.length-1)*Math.random());var i=0;if(relatedTitles.length>0)document.write('<h1>'+relatedpoststitle+'</h1>');document.write('<div style="clear: both;"/>');while(i<relatedTitles.length&&i<20&&i<maxresults){document.write('<a style="text-decoration:none;margin:0 10px 10px 0;float:left;background:#e6e6e6 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrCL6OlGfLAuBz2EiT9EMZ7lc3OMEWzCZEcK4_mbCqL1Smbt6rKGiNS9d4I3ADN2fpYJEJqhDQlnFCjWlAxuBlA8nIXFmOfA2Mb9ku52zD3_khp0TIerT6VAxpsxQiMXY7jG8DvZN1Llo/s1600/bar-bg2.png) repeat-x top;border:1px solid #c9c9c9;');if(i!=0)document.write('background:#e6e6e6 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgrCL6OlGfLAuBz2EiT9EMZ7lc3OMEWzCZEcK4_mbCqL1Smbt6rKGiNS9d4I3ADN2fpYJEJqhDQlnFCjWlAxuBlA8nIXFmOfA2Mb9ku52zD3_khp0TIerT6VAxpsxQiMXY7jG8DvZN1Llo/s1600/bar-bg2.png) repeat-x top;border:1px solid #c9c9c9;"');else document.write('"');document.write(' href="'+relatedUrls[r]+'"><img class="tutorial-onlineku_img" src="'+thumburl[r]+'"/><br/><div style="width:132px;padding:0 10px;color:#333;height:35px;text-align:center;margin:0px 0px; font:14px PT Sans Narrow; line-height:16px;">'+relatedTitles[r]+'</div></a>');if(r<relatedTitles.length-1){r++}else{r=0}i++}document.write('</div>');relatedUrls.splice(0,relatedUrls.length);thumburl.splice(0,thumburl.length);relatedTitles.splice(0,relatedTitles.length)}
//]]>
</script>
<script src='http://tutorial-onlineku.googlecode.com/files/carousellite.js' type='text/javascript'/>
7.Cari code <body> lalu copy dan simpan code di bawah ini tepat di bawah code <body> Codenya sudah saya parse jadi kalian ngak usah repot memparsenya biar siap pasang.(hasilnya akan tampil di atas header blog)
8.Atau mau di simpai di bawah header blog..?Cari code <div id='content-wrapper'> lalu copy dan simpan code di bawah ini tepat di bawah code <div id='content-wrapper'> Codenya sudah saya parse jadi kalian ngak usah repot memparsenya biar siap pasang.(hasilnya akan tampil di bawah header blog)
Ket:Code di bawah ini sudah saya parse agar bissa di simpan di dalam script Html blog kalian,Tapi jika anda mau parse code html yang lain anda bisa parse ( disini ) Pilihan dimana anda mau menempatkan slidernya terserah anda..
<div id='crosscol-wrapper'>
<div id='crosscol-wrapper'>
&lt;div id=&#39;carousel&#39;&gt;
&lt;div id=&#39;previous_button&#39;&gt;&lt;/div&gt;
&lt;div class=&#39;container&#39;&gt;
&lt;script&gt;
document.write(&quot; &lt;script src=\&quot;/feeds/posts/default?max-results=&quot;+numposts1+&quot;&amp;orderby=published&amp;alt=json-in-script&amp;callback=showrecentposts\&quot;&gt;&lt;\/script&gt;&quot;);
&lt;/script&gt;
&lt;div class=&#39;clear&#39;&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;div id=&#39;next_button&#39;&gt;&lt;/div&gt;
&lt;/div&gt;
&lt;script type=&#39;text/javascript&#39;&gt;
(function($) { $(document).ready(function(){
$(&quot;#carousel .container&quot;).jCarouselLite({
auto:4000,
scroll: 1,
speed: 800,
visible: 4,
start: 0,
circular: true,
btnPrev: &quot;#previous_button&quot;,
btnNext: &quot;#next_button&quot;
});
})})(jQuery)
&lt;/script&gt;
</div></div>
9.Save tamplate anda dan lihat hasilnya jika ukuranya ngak sesuai silahkan anda robah ukuranya sesuai dg tamplate anda sendiri,Selesai dan smoga sukses...
Nb.Code scrip no 7 atau yang di atas ini yang menentukan di mana anda mau menempatkan posisi slider entah itu di bagian header blog atau di bagian bawah header blog
Ditulis Oleh : Anonymous
Artikel Auto slider bagian Dua ( slider image entri ) ini ditulis oleh Anonymous pada hari . Terimakasih atas kunjungan Anda pada blog ini. Kritik dan saran tentang Auto slider bagian Dua ( slider image entri ) dapat Anda sampaikan melalui kotak komentar dibawah ini.
Anda sedang membaca artikel tentang Auto slider bagian Dua ( slider image entri ) dan anda bisa menemukan artikel Auto slider bagian Dua ( slider image entri ) ini dengan url http://tutorial-onlineku.blogspot.com/2012/09/auto-slider-bagian-dua-slider-image.html. Anda boleh menyebarluaskan atau mengcopy artikel Auto slider bagian Dua ( slider image entri ) ini jika memang bermanfaat bagi anda atau teman-teman anda,namun jangan lupa untuk mencantumkan link sumbernya.Tutorial Onlineku | Tutorial Blogspot | Tutorial Blogger | Tutorial Bagi Fomula
Share :
0 Comments
