Tak perlu mengejar yang tak perlu,
Namun mungkin perlu tau agar banyak tau..

Thursday, March 1, 2012

CARA MEMBUAT READ MORE AUTOMATIS POSTINGAN DI BLOGSPOT

Sebetulnya di Blogspot sendiri sudah di sediain fitur untuk red more postingan, tepatnya ada di kolom sewaktu kita ketik atau edit postingan...
Tapi jika anda ingin red more ini menjadi default atau secara auto setiap kita bikin postingan, kita membutuhkan element kode untuk di tambahkan ke template HTML..

Langkah-langkahnya sebagai berikut
  1. Masuk ke Rancangan kemudian pilih Edit HTML.
  2. Beri tanda centang pada Expand Template Widget 
  3. Tarik napas dulu,,hehehe...
  4. Lalu cari kode </head>   untuk mempermudah pencarian tekan F3 dan ketikan kode tersebut di papan pencarian yg ada di bawah..
  5. Minum dulu,,hehehe...
  6.  Lalu masukkan script di bawah ini tepat di atas </head>
<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script>
<script type='text/javascript'>
//<![CDATA[
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>
    7.  Setelah itu cari kode <data:post.body/> ,setelah ketemu ganti kode tersebut dengan kode  
 berikut:
<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;padding-top:20px;'>
<a expr:href='data:post.url'> <b> Baca Terusannya</b> &#187;&#187;&#160;&#160; </a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/>
</b:if>
    8.  Kemudian save....


45 0
Komentar With Facebook
Komentar With Blogger