Membuat Read More v2.0 by Anhvo

May 17, 2012

Membuat Read More v2.0 by Anhvo - Kalau dihitung-hitung mungkin sudah seminggu tidak posting sebab-sebab sibuk lantaran tugas banyak disamping itu modem yang juga ngak mau diajak kompromi, nah iseng untuk posting kali ini saya menyajikan tutorial segar bernuansa dasar-dasar blogger, maklum script ini dibuat pada tahun 2008 oleh Anhvo tadinya saya tidak mau posting tetapi demi langsingnya TrafficRank saya usahakan untuk posting walau tutorial ini ngak terlalu bermanfaat bagi yang sudah tahu.

Read More sendiri berguna untuk menyingkat posting yang terlalu panjang disamping itu juga membuat blog lebih indah dipandang, Read More ini saya pakai dalam blog ini adapun kelebihan dan kekurangannya, untuk kekurangan terletak pada Entri Pages, karena dengan memasang script v2.0 yang agak jadul maka Posting pada Entri Pages tidak dapat menampakkan diri alias Link Mati, walaupun link Read More tersebut di klik 1000x tetap tidak akan menampakkan posting tersebut, kalau kelebihan terletak pada model postingnya mungkain kalau dilihat lebih bagus dan indah (menurut saya) cukuplah basa-basinya sekarang saatnya membuat Membuat Read More v2.0 by Anhvo.

Langkah 1
Login ke Blogger
Masuk ke "Rancangan - Edit HTML"
Cheklist "Expand Template Widget"
Langkah 2
Gunakan ctrl F untuk mencari kode </head>
kemudian letakkan kode dibawah ini diatasnya

var thumbnail_mode = "float" ;

summary_noimg = 250;
summary_img = 250;

img_thumb_height = 120;

img_thumb_width = 120;

</script>

//<![CDATA[

/******************************************

Auto-readmore link script, version 2.0 (for blogspot)

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;
summary_img = 250;
Merupakan ringkasan posting

img_thumb_height = 120;

img_thumb_width = 120;

Merupakan Lebar dan Tinggi gambar, aturlah angka-angka tersebut sesuai selera anda
Langkah 3
Kemudian cari kode <data:post.body/> biasanya ada 2 kode yang sama, maka carilah yang ke2 dan 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>

Dan terakhir klik Preview, jika sudah sukses maka klik Simpan Template

Mungkin itu saja tutorial kali ini, semoga bermanfaat dan jangan bosan-bosan berkunjung ke blog ini jika ada yang perlu ditanyakan tanyakan saja, saya akan berusaha menjawab pertanyaan anda tentang blogging

Labels: Blog Design