Cara Membuat Auto Readmore di Blog - Cara memasang auto readmore di blog - Kali ini saya akan membahas bagaimana cara membuat auto readmore di blog.
Kenapa harus auto? Karena dengan membuat auto maka setiap post artikel
kita akan direadmore di homepage. Jadi kita tidak usah susah payah
membuat readmore satu-satu di setiap artikel, dan tahukah sobat bahwa
ini adalah salah satu cara membuat template blog kita menjadi SEO
Friendly. Oke berikut langkah-langkah membuat auto readmore di blog kita:
1. Masuk ke dashbor blog sobat.
2. Klik Template >> Edit HTML >> Lanjutkan (jangan lupa centang Expand Template Widget).
3. Cari kode </head>
4. Masukkan script di bawah tepat di atas kode nomor 3 tadi
<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>
5. Next cari kode <data:post.body/>
6. Ganti kode nomor 5 dengan kode berikut:
<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>
7. Simpan template dan lihat hasilnya.
Sekian tips dari saya. Ohya, jika blog mu ingin lebih SEO Friendly, kamu juga bisa membuat menu horizontal dropdown di blog sobat. :-)