You must enable Javascript in your browser to run or open this site.

Membuat Read More Versi 2.0

Kadang-kadang jika Posting terlalu panjang atau rumit orang akan susah melihat judul posting dengan isi postingan (Tidak rata). Apa sih itu Read More? Read More adalah suatu perintah HTML yang bertujuan untuk memotong sebagian posting.


Dalam arti tidak kepotong beneran, hanya saja jika di klik akan muncul Full Posting. Sebenarnya Nama Read More bisa diganti dengan nama Baca selanjutnya, See More, Lihat lanjutan artike, dll sesuai kemauan. Nah, Tutorial kali ini tentang Read More otomatis Versi 2.0 :

• Pertama-tama buka Blog sobat.

• Pilih tata letak atau Design -> Edit Html

• Centrang Explain Widget Template

• Cari kode ]]></b:skin>

• Letakan kode berikut dibawahnya kode ]]></b:skin> :
<script type='text/javascript'> var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</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;visibility:hidden; d
isplay:none"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+i
mg_thumb_height+'px"/></span>';
summ = summary_img;
}var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}//]]></script>
• Cari kode ini :
<p><data:post.body/></p>
• Hapus dan ganti kode tersebut dengan :
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink' style='float:right' title='Baca Artikel Selanjutnya'><a expr:href='data:post.url'>&#187; Read More Artikel... &#171;</a></span>
</b:if>
Kata Read More Artikel... Bisa ganti dengan kata lain yang sobat mau.
• Tahap terakhir Save Template.

Selamat mencoba Read More otomatis Versi 2.0 ini ya.
Salam blog setia! :)

0 Comment