Thursday, January 27, 2011

Cara buat READMORE automatic.

Dah lama wadud carik cara nak wat READMORE yang best lar.. dulu penah terjumpa cara buat READMORE dari fasilitas yang dah memang ada lam blogspot, tapi carik2 xjumpa gak.. adoi, tengok macam READMORE yang wadud wat kat blog wadud skang neh? hikhik.. cenggini la yang dah lama wadud carik, kalau yang biasa2 orang wat READMORE kene edit setiap kali nak post, mana yang kita nak cut supaya jadi READMORE, tapi yang wadud dapat ni dia automatic cut pada setiap posting kita.. tu yang best la bagi wadud, hehe..


Macam biasa, kene la edit HTML untuk wat sume neh, jangan ghiso.. wadud wat terbukti kan skang? bukan per, dah boring wat panjang2, kene ubah selera cikit.. hehe.. korang yang berminat, boleh la ikut2 step2 mudah ni okeh.. Bismillah dulu..


PERHATIAN!! DOWNLOAD DULU TEMPLATE ORI KORANG SEBELUM EDIT2 NE OK.


1. Log In dalam Blogspot korang.



2. Pegi kat Edit HTML dan TICK kan pada Expant Widget Template.



3. Cari word neh </head>, nak senang push button CTRL+F then ENTER.

4. copy sume code kat bawah neh.


<script type='text/javascript'>var thumbnail_mode = "no-float" ;
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>


5. PASTE code yang kita copy tadi betol2 atas yang dicari tadi, Kalau xpuas hati dengan THUMBNAIL atau lebar dari READMORE kita, leh edit kat sini :

summary_noimg = 430; tinggi potongan artikel tanpa gambar.
summary_img = 340; tinggi potongan artikel dengan gambar.
img_thumb_height = 100; ukuran tinggi thumbnail.
img_thumb_width = 120; ukuran lebar thumbnail.


6. Pastu, cari pulak code neh <data:post.body/>, cari dengan CTRL+F (untuk memudahkan pencarian).

7. Copy code kat bawah neh :

<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:right;padding-top:20px;'><a

expr:href='data:post.url'> read more "<data:post.title/>"</a></span> </b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>


8. Ghanti dengan code yang kita cari tadi, then preview, kalau dah puas boleh save.. selesai.. =) selamat mencuba..
Share:

0 comments: