Cara Membuat Slider Keren Ala The Killer

Hallo sobat. Kali ini saya mempunyai sebuah tutorial yang sangat bagus sekali. Saya mempunyai sebuah tutorial untuk membuat slider otomatis. Maksudnya kita tidak perlu repot-repot memasukkan isi dari slider tersebut. Jadi, jika kita posting, maka beritanya akan langsung tampil sendiri. Saya sebenarnya males sekali untuk membuat sebuah tutorial, tapi karena ini adalah pertanyaan sobat saya yang bernama Ranger Biru. Karenanya, saya langsung membuat sebuah tutorial kali ini.

Sebetulnya cara memasang widget ini sangatlah mudah jika kita tahu langkah-langkahnya. Sobat tertarik untuk memasang widget yang satu ini. Silahkan sobat ikuti langkah-langkah cara memasangnya di bawah ini :

1. Pertama Login ke blogger
2. Masuk ke Rancangan -> Elemen Laman
3. Setelah itu click add widget -> javascript
4. Setelah itu, masukkan script di bawah ini di dalam kotak yang telah terbuka :
   
   <div id='jarak_id'>
<div id='primarytopwrapper'>
<div id='featuredcontent'>
<div id='featurednav'>
<div id='paginate-featured-slider'>
<a class='prev' href='#prev'>Prev</a>
<a class='toc' href='#1' rel='1'>1</a>
<a class='toc' href='#2' rel='2'>2</a>
<a class='toc' href='#3' rel='3'>3</a>
<a class='toc' href='#4' rel='4'>4</a>
<a class='toc' href='#5' rel='5'>5</a>

<a class='toc' href='#6' rel='6'>6</a>
<a class='next' href='#next'>Next</a>
</div>
<div class='clear'></div>
</div>
<!-- featured entries -->
<div class='sliderwrapper' id='featured-slider'>
<script>
document.write("<script src=\"http://the-killermedia.blogspot.com/feeds/posts/default/-/"+label14+"?max-results="+numposts8+"&orderby=published&alt=json-in-script&callback=showrecentposts8\"><\/script>");
</script>
</div><!-- end of #featured-slider -->
<script type='text/javascript'>
featuredcontentslider.init({
id: "featured-slider", //id of main slider DIV
contentsource: ["inline", ""], //Valid values: ["inline", ""] or ["ajax", "path_to_file"]
toc: "#increment", //Valid values: "#increment", "markup", ["label1", "label2", etc]
nextprev: ["Prev", "Next"], //labels for "prev" and "next" links. Set to "" to hide.
revealtype: "mouseover", //Behavior of pagination links to reveal the slides: "click" or "mouseover"
enablefade: [true, 0.4], //[true/false, fadedegree]
autorotate: [true, 5000], //[true/false, pausetime]
onChange: function(previndex, curindex){ //event handler fired whenever script changes slide
//previndex holds index of last slide viewed b4 current (1=1st slide, 2nd=2nd etc)
//curindex holds index of currently shown slide (1=1st slide, 2nd=2nd etc)
}
})
</script>
<!-- End of featured slider -->
<!-- Entries below the featured section -->
<div id='belowfeatured'>

<div id='belowfeaturedleft'>
<script>
document.write('<span class="titleCatName"><a href="http://the-killermedia.blogspot.com/search/label/'+label22+'?max-results=10">'+Title3+'</a></span>');
document.write("<script src=\"http://the-killermedia.blogspot.com/feeds/posts/default/-/"+label22+"?max-results="+numposts5+"&orderby=published&alt=json-in-script&callback=showrecentposts5\"><\/script>");
</script>
</div>
<div id='belowfeaturedright'>
<script>
document.write('<span class="titleCatName"><a href="http://the-killermedia.blogspot.com/search/label/'+labelx+'?max-results=10">'+Title10+'</a></span>');
document.write("<script src=\"http://the-killermedia.blogspot.com/feeds/posts/default/-/"+labelx+"?max-results="+numposts5+"&orderby=published&alt=json-in-script&callback=showrecentposts5\"><\/script>");
</script>
</div>
<div class='banner'>
<div class='section' id='belowfeatureads'></div>
</div><!-- /banner -->
</div>
<!-- End of entries below the featured section -->
</div><!-- Enf of featuredContent --></div>
</div>
5. Setelah itu, click simpan.
6. Setelah selesai, masukke Edit Html
7. Tekan ctrl + f dan masukkan tulisan berikut : ]]></b:skin>
8. Setelah ketemu, copy script di bawah ini di atas code tadi :
   
   /* OTHER GLOBAL SELECTORS */
#primaryTopWrapper .wp-caption-text,
#primaryBottom .wp-caption-text,
#secondaryContentWrapper .wp-caption-text {
/* Hack to hide captions; NOT to be displayed on main page */display:none;
}

#jarak_id {padding:10px;}

/* PRIMARY TOP WRAPPER */

#primaryTopWrapper {
padding-bottom:10px;
}

/* MAIN CONTENT
============================================================== */
/* Features Slider */
#featuredContent {
margin-right:10px;
border-right:1px solid #ddd;
padding-right: 9px;
float:left;
display:inline;
width:600px;
}
#featured-slider {
position: relative;
overflow: hidden;
width: 600px;
height: 270px;
border-bottom:1px solid #ddd;
margin-bottom:10px;
}
#featured-slider img {
display:block;
min-height:200px;
height:auto !important;
height:200px;
width:600px;
}
#featured-slider .sliderPostPhoto {
position:relative;
height:200px;
width:600px;
overflow:hidden;
}
#featured-slider .sliderPostInfo {
position:absolute;
bottom:0;
width:576px;
border-left:10px solid #cd1713;
border-right:4px solid #000;
min-height:50px;
color:#fff;
padding:5px;
background: url(http://img837.imageshack.us/img837/8492/bgtransparent.png);
height:auto !important;
height:65px;
}
#featured-slider .sliderPostInfo p {
color:#fff;
font-size:1.1em;
padding:3px 5px 5px 6px;
}
#featured-slider .contentdiv{
visibility: hidden;
position: absolute;
left: 0;
top: 0;
z-index:1;
}
#featuredNav {
padding:5px;
display:block;
border:1px solid #efefef;
margin-bottom:5px;
height:15px;
}
#paginate-featured-slider {
font:bold 12px arial, verdana, sans-serif;
float:left;
width:500px;
margin-bottom:10px;
}
#paginate-featured-slider a {
color:#FFFFFF;
padding:2px 9px;
}
#paginate-featured-slider a:hover {
text-decoration:none;
color:#cd1713;
}
#paginate-featured-slider a.selected {
color:#fff;
text-decoration:none;
background:#cd1713;
}
.featuredViewAll {
float:right;
width:90px;
text-align:right;
}
.featuredViewAll a,.featuredViewAll a:hover {
text-transform:uppercase;
color:#cd1713;
font-weight:bold;
font-size:11px;
font-family:arial, tahoma, sans-serif;
}
#belowfeatured {
}
#belowFeaturedLeft {
float:center;
width:970px;
}
#belowfeatureads {
float:rigt;
width:970px;
}

/* Wrapper for main page post excerpts excerpts */

.featuredPost {
padding:5px 0;
border-bottom:1px dotted #e1e4f2;
margin-bottom:6px;
color:#FFFFFF;
width:600px;
}
.featuredPost p {
padding-top:3px;
padding-bottom:3px;
color:#FFFFFF;
}
.featuredPostMeta {
display:block;
font-style:italic;
font-size:10px;
text-align:right;
padding-top:3px;
color:#FFFFFF;
}
.featuredPostMeta a{
color:#cd1713;
}
.featuredPostMeta a:hover {
text-decoration:underline;
}
.lastPost {
border:none;
margin:0;
color:#FFFFFF;
}
.thumb {
padding:2px;
background:#fff;
border:1px solid #aaa;
}
9. Setelah itu, taruk code di bawah ini di bawah ]]></b:skin> :
   
   <script src='http://dinhquanghuy.110mb.com/template/jCarouselLite.js' type='text/javascript'/>
<script src='http://dinhquanghuy.110mb.com/template/contentslider.js' type='text/javascript'/>

<script type='text/javascript'>



imgr = new Array();

imgr[0] = "view blank";

showRandomImg = true;

aBold = true;

summaryPost = 140;
summaryTitle = 25;

numposts = 4;
numposts1 = 5;
numposts2 = 10;
numposts3 = 5;
numposts4 = 5;
numposts5 = 5;
numposts6 = 1;
numposts7 = 5;
numposts8 = 7;


label3 = "Nasional";
Title3 = "Berita Terbaru";

label4 = "Showbiz";
Title4 = "Showbiz";

label7 = "Sepak Bola";
Title7 = "Bola";

label6 = "Teknologi";
Title6 = "Teknologi";

label5 = "Selebrity";
Title5 = "Selebrity";

label8 = "Otomotif";
Title8 = "Otomotif";


label10 = "Kosmo";
Title10 = "Kosmo";

label11 = "Internasional";
Title11 = "Internasional";

label12 = "LifeStyle";
Title12 = "LifeStyle";


label13 = "Tutorial";
Title13 = "Tutorial";

label14 = "Berita dan Tutorial Online Anda";
Title14 = "Berita Utama";



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 showrecentposts1(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;

//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


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><a href="'+posturl+'">'+posttitle+'</a></li>';
document.write(trtd);


j++;
}

}

function showrecentposts2(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();

for (var i = 0; i < numposts2; 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;

//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


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><a href="'+posturl+'">'+posttitle+'</a></li>';
document.write(trtd);


j++;
}

}

function showrecentposts3(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();
document.write('<div class="featuredPost lastpost">');
for (var i = 0; i < numposts3; 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;

//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


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 ;
if (i==0) {
var trtd = '<a href="'+posturl+'"><img width="75" height="42" class="alignleft" src="'+img[i]+'"/></a><h2 class="spostTitle"><a href="'+posturl+'">'+posttitle+'</a></h2><p>'+removeHtmlTag(postcontent,summaryPost)+'...</p><span class="featuredPostMeta marginbottom">'+daystr+' / <a href="'+posturl+'">Read More </a></span><div class="clear"></div>';
document.write(trtd);
}
if ((i>0)&&(i<numposts)) {
var trtd = '<a href="'+posturl+'" class="list">'+posttitle+'</a>';
document.write(trtd);
}
j++;
}
document.write(' </div>');

}

function showrecentposts4(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();

for (var i = 0; i < numposts4; 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;

//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


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 ;
if (i==0) {
var trtd = '<div class="featuredPost"><a href="'+posturl+'"><img width="350" height="196" class="alignone" src="'+img[i]+'"/></a><h2 class="spostTitle"><a href="'+posturl+'">'+posttitle+'</a></h2><p>'+removeHtmlTag(postcontent,summaryPost)+'...</p><span class="featuredPostMeta">'+daystr+' / <a href="'+posturl+'">Read More </a></span><div class="clear"></div></div>';
document.write(trtd);
}
if ((i>0)&&(i<numposts)) {
var trtd = '<div class="featuredPost"><a href="'+posturl+'"><img width="70" height="70" class="alignright" src="'+img[i]+'"/></a><h2 class="spostTitle"><a href="'+posturl+'">'+posttitle+'</a></h2><p>'+removeHtmlTag(postcontent,summaryPost)+'...</p><span class="featuredPostMeta">'+daystr+' / <a href="'+posturl+'">Read More </a></span><div class="clear"></div></div>';
document.write(trtd);
}
j++;
}

}

function showrecentposts5(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();

for (var i = 0; i < numposts5; 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;

//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


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 = '<div class="featuredPost"><a href="'+posturl+'"><img width="75" height="50" class="alignleft" src="'+img[i]+'"/></a><h2 class="spostTitle"><a href="'+posturl+'">'+posttitle+'</a></h2><p>'+removeHtmlTag(postcontent,summaryPost)+'...</p><span class="featuredPostMeta">'+daystr+' / <a href="'+posturl+'">Read More </a></span><div class="clear"></div></div>';
document.write(trtd);

j++;
}

}

function showrecentposts6(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();

for (var i = 0; i < numposts6; 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;

//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


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 = '<div class="featuredPost lastPost"><a href="'+posturl+'"><img width="220" height="123" class="alignnone" src="'+img[i]+'"/></a><h2 class="spostTitle"><a href="'+posturl+'">'+posttitle+'</a></h2><p>'+removeHtmlTag(postcontent,summaryPost)+'...</p><span class="featuredPostMeta">'+daystr+' / <a href="'+posturl+'">Read More </a></span><div class="clear"></div></div>';
document.write(trtd);

j++;
}

}

function showrecentposts7(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();
document.write('<ul>');
for (var i = 0; i < numposts7; 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;

//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


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="202" height="114" class="alignnone" src="'+img[i]+'"/></a></div><p></p><h2 class="spostTitle"><a href="'+posturl+'">'+posttitle+'</a></h2>'+removeHtmlTag(postcontent,summaryPost)+'...</li>';
document.write(trtd);

j++;
}
document.write('</ul>');
}

function showrecentposts8(json) {
j = (showRandomImg) ? Math.floor((imgr.length+1)*Math.random()) : 0;
img = new Array();

for (var i = 0; i < numposts8; 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;

//cmtext = (text != 'no') ? '<i><font color="'+acolor+'">('+pcm+' '+text+')</font></i>' : '';


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 = '<div class="contentdiv"><div class="sliderPostPhoto"><a href="'+posturl+'"><img width="480" height="270" class="alignnone" src="'+img[i]+'"/></a><div class="sliderPostInfo"><h2 class="featuredTitle"><a href="'+posturl+'">'+posttitle+'</a></h2></div></div><div class="featuredPost lastPost"><p>'+removeHtmlTag(postcontent,summaryPost)+'...</p><span class="featuredPostMeta">'+daystr+' / <a href="'+posturl+'">Read More </a></span></div></div>';
document.write(trtd);

j++;
}

}


</script>
<script type='text/javascript'>
var classicMode = false ;
var summary = 30;
var indent = 3;

function stripHtmlTags(s,max){return s.replace(/<.*?>/ig, '').split(/\s+/).slice(0,max-1).join(' ')}

function getSummaryLikeWP(id) {
return document.getElementById(id).innerHTML.split(/<!--\s*more\s*-->/)[0];
}

function getSummaryImproved(post,max){
var re = /<.*?>/gi
var re2 = /<br.*?>/gi
var re3 = /(<\/{1}p>)|(<\/{1}div>)/gi
var re4 = /(<style.*?\/{1}style>)|(<script.*?\/{1}script>)|(<table.*?\/{1}table>)|(<form.*?\/{1}form>)|(<code.*?\/{1}code>)|(<pre.*?\/{1}pre>)/gi

post = post.replace(re4,'')
post = post.replace(re3,'<br /> ').split(re2)

for(var i=0; i<post.length; i++){
post[i] = post[i].replace(re,'');
}
var post2 = new Array();
for(var i in post) {
//if(post[i]!='' && post[i]!=' ' && post[i] != '\n') post2.push(post[i]);
if(/[a-zA-Z0-9]/.test(post[i])) post2.push(post[i]) ;

}


var s = "";
var indentBlank = "";
for(var i=0;i<indent;i++){
indentBlank += " ";
}
if(post2.join('<br/>').split(' ').length < max-1 ){
s = post2.join(indentBlank +' <br/>');
} else {
var i = 0;
while(s.split(' ').length < max){
s += indentBlank + ' ' + post2[i]+'<br/>';
i++;
}
}
return s;
}


function createSummaryAndThumb(pID,title,url,date,comment){
var posturl= url;
var title=title;
var date =date;
var comment = comment;
var div = document.getElementById(pID);
var content = div.innerHTML;
if (/<!--\s*more\s*-->/.test(content)) {
div.innerHTML = getSummaryLikeWP(pID);
div.style.display = "block";
}
else {

var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary;
if(img.length>=1) {
imgtag = '<a href="'+posturl+'"><img width="90" height="65" class="alignleft" src="'+img[0].src+'"></a>';
}
var summary1 = imgtag+'<p>'+stripHtmlTags(content,summary)+'...</p>';

div.innerHTML = summary1;
div.style.display = "block";
}
}
</script>
10. Jika ada konfirmasi bahwa widget tidak bisa di pasang, sebelumnya copy code di atas di kolom yang terdedia di alamat berikut
    http://centricle.com/tools/html-entities/
11. Setelah itu, click Encode. Jika loading sudah selesai, silahkan copy script yang sudah di parse di bawah ]]></b:skin>
12. Terakhir click simpan.

Nah, semoga tutorial saya kali ini bermanfaat. jika ada pertanyaan, jangan sungkan untuk bertanya kepada saya. Saya siap membantu anda.

Description: Cara Membuat Slider Keren Ala The Killer Rating: 5 Reviewer: Coba Coba - ItemReviewed: Cara Membuat Slider Keren Ala The Killer