Cara membuat Read more secara otomatis pada blogger berserta gambar

Cara membuat read more  secara otomatis + Gambar sangat praktis dan mudah dengan Sedikit tutorial anda akan mudah membuatnya

kali ini Mr. KURMER ingin membagi tutorial membuat read more otomatis

  Banyak juga pemula-pemula blogspot yang kurang pandai dalam membuat READ MORE pada
artikel dengan otomatis


Jadi ketika kita membuat sebuah postingan(artikel) maka secara otomatis postingan(artikel) tersebut.akan membuat baca selanjutnya dengan otomatis tanpa edit apapun lagi




Contoh hasilnya seperti ini

 Baiklah kita langsung saja memulai tutorialnya



1. silahkan masuk blogspotnya pilih menu Template>>Edit

2. lalu tekan pada keboard crl+f  pada kolom scrip(coding)kemudian ketikan </head> >>enter 




3 copy paste kan code ini tepat di atas </head>

-------------------------------------------------------------------------------------------------------------------------
<!--Auto baca selanjutnya http://kurmr.blogspot.co.id/-->

 <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 = 300; //banyaknya huruf jika tidak ada gambar

 summary_img = 250; //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 Baca selanjutnya Akhir-->

----------------------------------------------------------------------------------------------------------------------   

4 tekan ctrl+f  pada kolom script(koding) lagi kemudian carilah  <data:post.body/>  + >> Enter




   Block kode tersebut dan copy paste dengan code di bawah ini
-------------------------------------------------------------------------------------------------------
<!-- Auto Baca selanjutnya 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 Baca selanjutnya Akhir -->
---------------------------------------------------------------------------------------------------------------------------------------------------------

5. klik save dan simpan lalu liatlah hasilnya



Catatan:
 jika  setelah <data:post.body/>  di timpa dengan koding(script) di atas juga tidak   bisa cobalah <data:post.body/> yang lain akan tetapi kode (script) yang lama di hapus dulu :D