Cara Membuat Read More Otomatis Di Blogspot



Cara Membuat Read More Otomatis Di Blogspot - Read more adalah pemenggalan ditengah sebuah postingan agar terlihat lebih singkat dan cantik. Read more ini di gunakan jika ingin menampilkan banyak postingan di  Home / beranda blog agar tampilanya tidak terlalu panjang.
Blogger.com sebenarnya sudah menyediakan fasilitas untuk membuat read more, tapi terkadang kita sering lupa untuk memakainya. Nah, oleh karena itu saya ingin berbagi informasi cara membuat read more otomatis di blog. Hanya perlu beberapa kali copy aja, blog anda bisa dipasangi Read more otomatis.
Berikut langkah - langkahnya :
  • Seperti biasa masuk ke akun blog anda.
  • Masuk kemenu Edit Html lalu centang kotak Expand
  • Cari kode seperti ini </head>
  • Copy pastekan kode dibawah ini tepat diatas kode </head>
<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 450;
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>
  • Cari lagi kode seperti ini <data:post.body/> lalu hapus dan diganti dengan kode di bawah ini
<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>
&lt;br/&gt;
<span class='rmlink' style='float:left'><b>Readmore</b> &#8594; <a expr:href='data:post.url'><data:post.title/></a></span>
  • Klik save. Selesai.
Enak kan, ayo monggo di coba. Jika cara diatas tidak bekerja tinggalkan komentar anda.

Semoga bermanfaat,..

0 comments:

Post a Comment