Cara Memasang Readmore Otomatis

Sebenarnya ada dua cara membuat read more di bloggger, namun kali ini saya akan mengangkat satu cara saja, yaitu Cara Membuat Read More Otomatis Pada Posting yang ada thumbnail (Gambarnya).


Ok Mari Kita mulai belajar membuat Read More sendiri...

1. Login ke akun blogspot,
2. Klik Design/Rancangan >> Edit HTML >>

3. Klik Expand Templates Widget,

3. cari kode :  </head>  , lalu tetakkan kode berikut tepat diatas kode : </head>

<script type='text/javascript'> var thumbnail_mode = "no-float" ; 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>


Keterangan:::
summary_noimg = 430 adalah jumlah ringkasan tulisan jika tidak ada gambarnya
summary_img = 340 adalah jumlah ringkasan tulisan jika ada gambarnya
img_thumb_height = 100 adalah tinggi gambar
img_thumb_width = 120 adalah lebar gambar


4. Selanjutnya cari kode :  <data:post.body/>  kemudian ganti kode tersebut dengan kode di bawah ini :

<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:right;padding-top:20px;'> <a expr:href='data:post.url'>Read more»» by FBL_Mufid-Dreamlead  </a></span> </b:if> <b:if cond='data:blog.pageType == "item"'><data:post.body/> </b:if>

NB : Read more»» by FBL_Mufid-Dreamlead bisa di ganti dengan kesukaan agan

5. Terakhir Save Templates.. dan lihat hasilnya..