Thursday, November 8, 2012

Buat Read More Pada Blog

Kalau google, memang banyak cara untuk kita buat Read More pada blog. Cuma kita kena pandai pilih yang mana 1. Lepas tu kena cuba-cuba. Kadang jadi. Kadang tidak. Yang ni aku dah cuba semalam. Alhamdulillah jadi. Dan ianya auto. Maksudnya ap-apa entri yang kita tulis lepas ni, semuanya akan ada Read More. Ada juga jenis yang kita kena buat di setiap entri.


1)Log in blog. Akan terus ke dashboard. Klik pada More Option dan pilih Template.


2)Klik pada Edit HTML


3)Klik Proceed


4)Tick pada Expand Widget Templates


5)Dengan menggunakan keyboard, tekan Ctrl+F. Akan keluar kotak Find macam gambar kat bawah.


6)Dalam kotak Find tu, taip</head> . Paste kan kod di bawah sebelum </head>.

<script type='text/javascript'>

var thumbnail_mode = "float" ;

summary_noimg = 350;

summary_img = 450;

img_thumb_height = 140;

img_thumb_width = 140;

</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)Sekali lagi dalam kotak Find, taip <data:post.body/>. Cari yang paling atas. Padam   dan gantikan dengan kod di bawah.

<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'><a expr:href='data:post.url'><img src='http://1.bp.blogspot.com/_LZtXSNcp76A/SxuOVTvCKgI/AAAAAAAAAr8/rFJNAYKSomY/s320/read+more_thumb%5B1%5D.png'/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>


8)Klik Preview dulu sebelum Save. Sebab takut tak jadi. Tapi aku buat sekali terus jadi. Alhamdulillah. 

6 comments:

KaKi Jalan said...

jadi laaa..
terima kasih..
view la blog sy..
http://sayakakijalan.blogspot.com
huhuhu

Mizz Aiza said...

thanks.. menjadi.. ^_^

kitatauke said...

@KaKi Jalan-tahniah..:)

kitatauke said...

@Mizz Aiza-tahniah jugak..

maria firdz said...

knp x mnjadi.. huhu... berkali dh try... :(

kitatauke said...

@maria firdz-rasanya byk jenis nak buat read more ni..kena test...mgkn tak sesuai dgn anda..