membuat Read More atau Baca Selengkapnya di Blog Blogger

Cara membuat Read More atau baca selengkapnya di blog blogger. coba anda tiru dan mulai pasang di blog anda. caranya copy paste dahulu kode dibawah ini yang berwarna merah, yang berwarna hijau bisa anda ganti sesuai keinginan anda sendiri. mau coba untuk membuat read more atau baca selengkapnya di blog anda, silahkan, selamat mencoba.....

<!--ReadMore http://tropicalfruits1327.blogspot.com/-->

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style>
.post-body{text-align:justify;}
.post-body img{max-width:none;width:auto;}
.read-more{float:left; padding-top: 10px;}
.read-more a{ color: #fff!important;text-shadow:0 1px 0 rgba(0,0,0,0.5);background:#0457A9;  text-decoration:none;font:bold 13px Arial;padding:5px;}
.read-more a:hover{text-decoration:none;background:#666;}
.pic{border: 10px solid #fff;float:left;height:165px;width:250px;margin-right: 20px;margin-bottom:10px;overflow:hidden;box-shadow: 5px 5px 5px #111;}
.grow img{height:165px;width:250px;transition: all 2s ease;}
.grow img:hover{width:400px;height:250px;}
</style>
<script type='text/javascript'>
var thumbnail_mode = &quot;yes&quot;; //yes -dengan gambar, no -tanpa gambar
summary_noimg = 400; //banyaknya huruf jika tidak ada gambar
summary_img = 300; //banyaknya huruf jika ada gambar
img_thumb_height = 165;
img_thumb_width = 250;
</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(thumbnail_mode == "yes"){if(img.length>=1){imgtag = '<div class="grow pic"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></div>';summ = summary_img;}}var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';div.innerHTML = summary;}
//]]></script>
</b:if>
</b:if>

<!--Auto Read More Akhir-->


- copy paste kode HTML diatas, dan simpan di atas kode </head>
- terus di simpan template, setelaj itu cari kode title='blog.post' atau title='postingan.blog' apabila anda memakai bahasa indonesia
- Jika suda menemukan kode seperti gambar di atas silahkan klik tanda panah kecil warna hitam sebelah kiri kalau tidak ada klik saja angka yang lurus dengan kode tersebut.
- Cari kode yang di tandai dengan kotak hitam. "POST' VAR='POST'".
- Setelah ketemu klik tanda panah yang lurus dengan kode tersebut kalau tidak ada tanda panah klik saja angkanya atau langsung cari kode seperti ini.
<data:post.body/>
- setelah ketemu, ganti kode tersebut dengan kode dibawah ini yang berwarna merah:

<!-- Auto read more Mulai -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<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>
      <div class='read-more'>
      <a expr:href='data:post.url'>Baca Selengkapnya &#187;</a>
      </div>
</b:if>
</b:if>
<!-- Auto read more Akhir -->

setelah diganti kodenya, simpan template. seterusnya coba lihat di pratinjau. berhasil atau tidak...
semoga bermanfaat..........

Ditulis oleh: Dori Hudori

td-Informasi, Updated at: 2/28/2014 04:51:00 AM