Friday, May 21, 2010


Read more untuk blogspot

3

Selamat malam semua..ada yang dah tidur ker..awal lg kan..malam-malam minggu gini..mesti terang mata..tak macam hari-hari biasa..mesti cpt je ngntuk..pastu malas nk bangunReadMore pagi..alasan?malas nak gi kerja..tu ai je yek..youall semua rajin..Tadi amiera ada tanya macam mane nak letak "read rest of entry" macam dalam blog ai ni..Jadi Ai pun nak share le macam mana nak add read more atau baca seterusnya ata apa –apa jelah seangkatan dengan nya..khas untuk amiera dan sape-sape yang nak buat read more jugak ;-)

1) backup le dulu template tu..in case kan..mana kita nak tau..malang tak berbau.

2) Login akaun blog —> Layout -->EDIT HTML, search code </head>

3) Pastekan script dibawah ini betul-betul di atas code </head>

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 450;
summary_img = 450;
img_thumb_height = 120;
img_thumb_width = 120;

</script>

<script type='text/javascript'>
//<![CDATA[
/****************************************************************
Auto-readmore link script, version 2.0 (for blogspot)
*****************************************************************/
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) Save dulu template.

5) Masih pada page EDIT HTML, klik "Expand widget template"

6) Search code <data:post.body/>

7) Gantikan <data:post.body/> dengan semua code dibawah

<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 … <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

8) Save

9) Selesai

P/S:

var thumbnail_mode = "float";  (youall boleh pilih untuk meletak thumbnail berada di (float) kiri atau jika tidak mau boleh gantikan dengan (no-float)
summary_noimg = 450; (Boleh ubah mengikut selera sendiri --> berapa panjang perkataan dalam post tanpa imej thumbnail)
summary_img = 450; (Boleh ubah mengikut selera sendiri --> berapa panjang perkataan dalam post dengan imej thumbnail)
img_thumb_height = 120; (Saiz 'tinggi’ imej thumbnail dalam pixel)
img_thumb_width = 120; (Saiz 'lebar’ imej thumbnail dalam pixel)

READ MORE … youall boleh tukar guna ayat youall sendiri cth : “nak baca lagi..klik la….”

Kalau nak guna imej ,gantikan READ MORE …. tu dengan code ni <img width="120px" height="32px"   src="URL imej readmore"/>

Untuk contoh real,boleh refer main page ai.."read rest of entry" Selamat mencuba..

3 comments:

^lurve_purple^ said...

thankz akak...

cepat jek dier wat entry.. hehe.. lagi satu soalan nak tanye.. read more tue kalau nak tukar ngan imej, kat bahagian mane eh nak ubah coding??

mrs.JamaL said...

salam dear..nak tanye..tu benda alah ape kenamenya..yang page atas y u buat personal, Tutorial, keluarga...n bla..bla..lagi tu camane eee...

sori ye tanye2 ni..
tenkiu...

L-E-E-Z-A said...

mrs.jamal benda alah tu nama nye navbar menu..u nak wat cmtu ke..nnti ai wat setep bai setep ye ;-)

Post a Comment