Cara membuat read more otomatis pada blog

Cara membuat read more otomatis pada blog - Postingan ini tujuannya untuk menjawab pertanyaan temen ane yang beberapa hari yang lalu disaat ane sedang OL di facebook dia bertanya "kang gimana cara membuat read more otomatis pada blog?" Dengan seketika ane gak pikir panjang lebar, langsung aja ane bikin tutorialnya di blog tercinta ini sekaligus ane ingin berbagi kepada nawbi blogger semua. Untuk yang udah Mastah, mohon minggir sebentarnya.. hee..hee 

Postingan ini hanya akan membahas tentang cara membuat read more otomatis pada blog, sementara jika diantara agan-agan ada yang ingin menghapus tombol read more, agan bisa pergi ke salah satu postingan ane tentang cara menghapus read more. Membuat read more otomatis pada blog memang sangatlah penting untuk diutamakan karena disamping cara ini akan membuat tampilan blog kita menjadi lebih rapi dan disukai oleh pengunjung, tentunya hal ini akan membuat pengunjung blog penasaran dan ingin membacanya sehingga nilai klik suatu blog akan semakin berbobot di mata search engine. Alasan lain membuat read more otomatis pada blog adalah bila kita membuat sebuah artikel yang tidak terlalu panjang mungkin ini tidak akan menjadi persoalan yang penting, namun jika artikel kita seperti struk belanjaan di supermarket tentunya hal ini akan merusak pemandangan dan kurang nyaman untuk di baca. Baiklah, untuk lebih jelasnya silahkan perhatikan tutorial di bawah ini.  

Cara membuat read more otomatis pada blog

1. Buka template -> Edit HTML -> Centang menu “Expand Widget Tempate”

2. Cari kode </head> (gunakan Ctrl+F untuk memudahkan proses pencarian)

3. Simpan kode dibawah ini persis di atasnya kode </head>

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; 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;"><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>

4. Cari kode <data:post.body/>

5. Ganti kode <data:post.body/>  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>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'> <b> readmore</b> &#187;&#187;&#160;&#160; </a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/>
</b:if>

6. Klik Simpan dan lihat hasilnya.

Cukup mudah bukan tutorila cara membuat read more otomatis pada blog? semoga pembahasan kali ini dapat bermanfaat bagi kita semua khususnya bagi temen ane yang sudah mengutarakan keluh kesahnya dengan pertanyaan "kang gimana cara membuat read more otomatis pada blog?". Semoga berhasil kawan.