Cara Membuat Auto Read More pada Blogger

Posting kali ini cara membuat auto read more di blogger. Untuk kali ini sangat menarik dalam membuat auto read more karena dalam posting kita tidak perlu memposting seperti kita membuat read more (posting yang lalu), sehingga kita hanya buat posting saja. Secara automatis read more akan terlihat dengan sendirinya.

Kelebihan yang lain dari fungsi auto read more kali ini yaitu kita bisa mengatur berapa banyak karakter yang akan ditampilkan. Ada karakter yang bisa ditampilkan jika ada sebuah gambar dalam postingan yang anda buat. Dan adapula yang tanpa menampilkan gambar. Memang cara membuat fungsi auto read more kali ini agak rumit tapi ada sisi positifnya juga yaitu kita tidak perlu lagi membuat fungsi read more pada setiap posting .

Untuk pembuatanya langkah-langkanya sebagai berikut :

Cari kode </head> kemudian letakan script dibawah ini di atas kode . copy paste script auto read more barikut ini:

<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>

Tetap pada halaman EDIT HTML, Beri tanda centang pada "Expand widget template" kemudian cari kode dibawah ini

<data:post.body/>

<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.body/>");</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>

Setelah selesai tekan save template.
Keterangan tentang cara membuat auto read more:

var thumbnail_mode = "float"; (kita dapat memutuskan apakah letak thumbnail berada di (float) kiri atau jika tidak silahkan ganti dengan (no-float)
summary_noimg = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting tanpa gambar / thumbnail)
summary_img = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting dengan gambar / thumbnail)
img_thumb_height = 120; (Thumbnail 'tinggi dalam piksel)
img_thumb_width = 120; (Thumbnail 'lebar dalam piksel).

Dengan keterangan seperti di atas kamu dapat merubah script fungsi auto read more sesuka hati. Selamat mencoba.