Thursday, September 05, 2013

Cara Membuat Read More pada Pos Blog Secara Otomatis

Artikel sebelumnya yaitu cara mebuat read more pada pos blog merupakan cara manual. Kali ini akan saya share cara membuat read more pada pos blog secara otomatis.

Langkah-langkahnya adalah sebagai berikut :

1. Login ke Blogger > Template > Edit HTML.
    Kemudian tempatkan kursor dibagian pengeditan template dan klik salah satu script, lalu tekan CTRL+F untuk melakukan pencarian.
2. Cari kode </head> , dan letakkan kode ini diatasnya :
<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 250;
summary_img = 220;
img_thumb_height = 120;
img_thumb_width = 220;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(b,a){if(b.indexOf("<")!=-1){var d=b.split("<");for(var c=0;c<d.length;c++){if(d[c].indexOf(">")!=-1){d[c]=d[c].substring(d[c].indexOf(">")+1,d[c].length)}}b=d.join("")}a=(a<b.length-1)?a:b.length-2;while(b.charAt(a-1)!=" "&&b.indexOf(" ",a)!=-1){a++}b=b.substring(0,a-1);return b+" [...]"}function createSummaryAndThumb(d){var f=document.getElementById(d);var a="";var b=f.getElementsByTagName("img");var e=summary_noimg;if(b.length>=1){a='<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+b[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var c=a+"<div>"+removeHtmlTag(f.innerHTML,e)+"</div>";f.innerHTML=c}; 
//]]>
</script>
3. Ganti kode <data:post.body/> pada template anda, dengan kode berikut :
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&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:left'><b>Baca Selengkapnya</b> &#8594; <a expr:href='data:post.url'><data:post.title/></a></span>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
</b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>
4. Klik Pratinjau untuk melihat hasilnya. Jika sudah sesuai dan terpasang dengan benar klik Save Template.


Selamat mencoba :D

Sumber : http://impoint.blogspot.com/2013/03/cara-membuat-auto-readmore-di-blog.html#axzz2dzBN7uLy

No comments:

Post a Comment