Friday, July 8, 2011

Cara GAMPANG Membuat Read More di blog

Biasanya kita menulis entri, atau postingan yang panjangnya bukan main,
hal itu akan memakan tempat di halaman utama pada blog kita, dan hal tersebut berpengaruh terhadan kebeetahan pengungjung untuk berlama lama di blog kita,,,

ada pertanyaan: Bagaimana ya cara membuat Read More ata baca selengkapnya pada blog..????
Apa sich fungsi kita membua Read More..????

langsung aja kita dengan cara2nya membuat Read More...???
pertanyaan anda nntinya aka terjawab sendiri di sini...
jangan lupa backup dulu tamplate anda sebelum mengedit, untuk mencegah kemungkina terjadi kesalahan pada saat mengedit...

biasanya script di cari tidak selalu sama, karna masing masing blog berbeda tempalte. biasanya hanya kata depan yang sama,

berikut lankah-lankahnya:
login dulu ke blog anda,kemudian klik menu tata letak ata desaign (rancangan)

 





Kemudian Klik Menu Edit Html







Setelah itu beri centang pada pada bagian Expand Widget Templates













 Kemudian cari Script </head> untuk lebih mudah gunakan find atau control+f dan ketikkan kede tersebut


setelah ketemu, copy kode Auto Read More di bawah ini kemudian paastekan di atas kode </head> tersebut. berikut scriptnya:

<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[
/******************************************
Auto-readmore link script, version 2.0 (for blogspot)
(C)2008 by Anhvo
visit http://en.vietwebguide.com to get more cool hacks
********************************************/
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>

Keterangan:
summary_noimg = 250 adalah jumlah ringkasan tulisan jika tidak ada gambarnya
summary_img = 250 adalah jumlah ringkasan tulisan jika ada gambarnya
img_thumb_height = 120 adalah tinggi gambar
img_thumb_width = 120 adalah lebar gambar

lankah berikutnya Temukan kode <data:post.body/>
kemudian ganti kode tersebut dengan kode di bawah ini

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

selesai,, coba anda preview, klo udah ada tulisan read more ata baca selangkapanya, berarti anda sudah berhasil.. SELAMAT MENCOBA


Terimah Kasih atas kunjungan anda di blog saya,,

0 comments:

Post a Comment

Note: Only a member of this blog may post a comment.