1.15.2012

Cara Membuat Read More Otomatis pada Blog anda

Kali ini saya mau share tentang pembuatan Read More otomatis mungkin di antara anda sangat kesulitan membuatnya dan masih bertanya-tanya bagaimana cara membuat read more itu dengan tulisan yang kita inginkan.Oke kita langsung ke pokok permasalahan aja cara sebenarnya sangat mudah dan gampang dan gak pakai lama sih sebenarnya (bagi kamu yang paham tentang script).pertama-tama siapakan rokok dan kopinya dlu biar gak stres waktu membuatnya heheheh...:-)
Nah yang kedua pastikan anda sudah mempunya blog dlu kl belum punya silahakan buat dlu lah...nah seterusnya ikuti panduan di bawah ini:

  1. Login dlu blog kamu
  2. masuk ke Rancangan-Edit Html
  3. jangan lupa mencentang expand widget templates
  4. cari code </head> cara yang mudah mencarinya tekan Ctrl+F  dan masukakn code </head> tersebut di Find letaknya di pokok kiri bawah browser anda…
  5. kl sudah ketemu </head> letakkan script dibawah ini dibawah persis code </head> yang tadi

<!--AUTOMATIC-READMORE-STARTS-->
<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
/******************************************
Widgets By BloggerBuzz

http://www.bloggerbuzz.net

********************************************/
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>


  1. nah kl sudah di copy script yang di atas tadi,langkah selanjutnya cari code <data:post.body/> pastinya dengan cara mencari </head> yang tadi supaya pencarian biar cepat
  2. oke, setelah ketemu code <data:post.body/> ganti dengan code di bawah ini:

<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>


  1. nah pembuatan read more sudah selesai klik Simpan Template

Tidak ada komentar:

Posting Komentar