Selasa, 22 Oktober 2013

Cara Membuat AUTO READMORE di blog



1. Login ke Blog Anda
2. Pilih Template lalu Edit HTML,kemudian Tempatkan kursos mouse anda di dalam kotak
    pengeditan Template
3. Tekan CTRL+F, Muncul sebuah kotak lalu Cari kode </head> dan letakkan kode di bawah ini
    tepat di atas kode berikut  </head>

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 280;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[

/******************************************
Auto-readmore link script, version 2.0 (for blogspot)
(C)2008 by Anhvo
visit http://en.vietwebguide.com to get more cool hacks
********************************************/

function removeHtmlTag(strx,chop){

if(strx.indexOf("<")!=-1)
{

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);
}
}
strx = s.join("");
}
chop = (chop < strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' && strx.indexOf(' ',chop)!=-1) chop++;
strx = strx.substring(0,chop-1);
return strx+'...';
}
function createSummaryAndThumb(pID){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = summary_noimg;

if(img.length>=1) {
imgtag = '<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';
summ = summary_img;
}
var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>


4. Temukan kode berikut <data:post.body/> lalu ganti dengan kode dibawah ini


<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink' style='float:right'><a expr:href='data:post.url'><img src='http://lh6.ggpht.com/_Kwwy9VyLMKw/S3qDYQZCiRI/AAAAAAAACxA/aXY0neVNzh0/but_readmore.png'/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>


5. Klik Pratinjau terlebih dahulu sebelum anda menyimpannya
6. Dan Klik SAVE

Note : summary_noimg = 280; (Jumlah huruf artikel tanpa gambar)
           summary_img = 280;(Jumlah huruf artikel bergambar)
           img_thumb_height = 120;(Tinggi gambar)                                                                                               img_thumb_width = 120; (Lebar gambar) 
           Dan tulisan yang berwarna biru adalah URL gambar. Anda dapat mengganti URL gambar  di   
           atas,dengan URL gambar kesukaan anda sendiri. 

sumber : blogklopedia.blogspot.com/ 

.::. S U S .::. 

Tidak ada komentar: