Blogger ini selalu mengingatkan, karena kami selalu memberikan artikel yang berkualitas tidak ada asal-asalan, jadi saya sarankan Backup dulu Template anda, misalnya Copy Script HTML ke Notepad. Karena jika tidak sesuai dengan keinginan anda Featured Post nya maka dengan mudah membalikan seperti semula.
Cara pertama :
1. Masuk Blogger -> Login.
2. Template -> Edit HTML.
3. Temukan kode </head>
4. Copy - Paste kode dibawah ini, dan letakkan diatas kode </head> .
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js' type='text/javascript'/>
<script src='http://yourjavascript.com/221222113215/jquery.innerfade.js' type='text/javascript'/>
<script src='http://yourjavascript.com/122111125120/cycle.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
imgr = new Array();
imgr[0] = "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR6mlECjZfYtebWzz4xJEvkoqbmkeflB3nEAW7dWaTnektYaDgJFkW0xMuLP5OSH4cqy7My0R82emfNY39BEEyAUFADhpn_vBnRBi2ZYNFfEn7xQ_d1zVRBCnLk7C-NwsJ_Dku_T81yRo/s1600/no+image.jpg";
showRandomImg = true;
aBold = true;
summaryPost = 300;
summaryTitle = 25;
numposts = 1;
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('<div class="slides">')
if (numposts <= json.feed.entry.length) {
maxpost = numposts;
}
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;
//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 trtd = '<div><p class="featured-thumb"><a href="'+posturl+'"><img width="290" height="180" src="'+img[i]+'"/></a></p><div class="featuredTitle"><a href="'+posturl+'">'+posttitle+'</a></div><p>'+removeHtmlTag(postcontent,summaryPost)+'... </p></div>';
document.write(trtd);
j++;
}
document.write('</div>')
}
//]]>
</script>5. Kemudian, Temukan lagi kode <div class='main-wrapper'> dan letakan dibawah ini tepat bawahnya.
Catatan : Blogger saya tidak ada kode <div class='main-wrapper'> Jika anda mempunyai keluhan yang sama? Temukan saja kode <b:section class='main' id='main' name='Main' showaddelement='no'> atau kode <b:widget id='Blog1' locked='false' title='Blog Posts' type='Blog' version='1' visible='true'
Note : False bisa diganti dengan True ketika mencari kode menggunakan Ctrl + F .
!--Lihat gambar biar ngerti dan faham --!
Saya menaruhnya kodenya dibagian <div class='columns-inner'> tepat dibawah nya. karena saya tidak ada kode <div class='main-wrapper'> . Itu kalo saya, karena setiap template berbeda-beda.
6. Copy - Paste kode berikut ini, keterangan diatas ya kalo soal menaruh kode diatas atau dibawah.
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<div id='featuredpost'>
<div class='container'>
<script>
document.write(" <script src=\"/feeds/posts/default/?max-results="+numposts+"&orderby=published&alt=json-in-script&callback=showrecentposts\"><\/script>");
</script>
</div>
<!--end .container-->
</div></b:if>
</b:if>8. Copy-Paste kode berikut ini, dan letakkan kode dibawah ini tepat diatas kode ]]></b:skin> .
#featuredpost {background:#000;float:left;margin:10px 10px 20px 10px; padding:0 0 10px;width:97%; position:relative;color:#eee;}
#featuredpost .featured-thumb {float:left; margin:15px; padding:0px;}
#featuredpost .container {height:205px; margin:0 10px 0 0;overflow:hidden; position:relative;font-family: Arial;font-size: 13px;font-style: normal;font-variant: normal;font-weight: normal;line-height: 1.3em;}
.featuredTitle{padding-top:15px;font:17px Oswald;}
.featuredTitle a{color:#f5ff88}
.featuredTitle a:hover{color:#c00}Keterangan : Background bisa diubah dengan kode warna " Klik Disini "
background:#000; : Background Featured Post
{height:205px; : Ketingian Featured Post
width:97% : Lebar Featured Post
8. Save Templated!
9. Silakan Pratinjau atau bisa langsung lihat Blogger anda^.^
Demikian Tips Blogger kali ini, Selamat mencoba dan Terima kasih Telah berkunjung dan membaca Artikel ini. Semoga Bermanfaat!
