Auto read more dan pengaturannya
Untuk pemasangannya cukup mudah, yaitu melalui halaman edit HTML. Demikian juga pengaturannya, anda cukup memasukkan value yang telah tersedia.
Langsung saja pada pokok bahasan kita, namaun sebelum mengedit template sebaiknya Anda sudah membackup templete lengkap, dan menyimpannya di komputer anda. serta menggunakan menu Find (control F) untuk mempermudah pencarian kode yang dimaksudkan.
PEMASANGAN
Langkah 1. Masuk kehalaman 'EDIT HTML', dan beri tanda centang pada 'EXPAND WIDGET TEMPLATE'.
Langkah 2. Cari kode berikut ini:
</head>
Langkah 3. Letakan script dibawah ini di atas kode </head>.
<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>
Langkah 4. Selanjutnya cari kode berikut ini:
<data:post.body/>
Langkah 5. Hapus kode <data:post.body> lalu ganti dengan kode dibawah 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 - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
Langkah 6. simpan perubahan dan lihat Blog anda.
PENGATURAN
Anda dapat mengatur variabel yang ada pada Auto read more ini sesuai dengan kebutuhan anda, contohnya sebagai berikut:
var thumbnail_mode = "float"; (kita dapat memutuskan apakah letak thumbnail berada di (float) kiri atau jika tidak silahkan ganti dengan (no-float)
summary_noimg = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting tanpa gambar / thumbnail)
summary_img = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting dengan gambar / thumbnail)
img_thumb_height = 120; (Thumbnail 'tinggi dalam piksel)
img_thumb_width = 120; (Thumbnail 'lebar dalam piksel)
Demikian cara memasang Auto read more dan pengaturan variabelnya, selamat mencoba dan semoga berhasil.... happy blogging.
0 Response to "Auto read more dan pengaturannya"
Post a Comment