Jumat, 30 September 2011

Cara Membuat Read More Otomatis

Cara Membuat Read More Otomatis - Pada kesempatan kali ini saya akan share cara membuat read more otomatis, sebelumnya artikel ini direquest oleh seseorang sobat xaon, dengan adanya read more otomatis kita bisa menentukan penggalan artikel dan image dengan mudah yang akan muncul pada setiap halaman blog sobat sehingga blog kita terlihat rapih, oke tanpa basa-basi lagi, langsung aja ke tkp, cekibrot

  1. Login ke blogger -> Rancangan -> Edit HTML.
  2. Centang Expland Template Widget.
  3. Lalu cari kode </head>. 
  4. Taruh kode dibawah tepat di atas kode tadi
<script type='text/javascript'>var thumbnail_mode = &quot;no-float&quot;;summary_noimg = 450;summary_img = 360;img_thumb_height = 120;img_thumb_width = 150;</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>
    5.  Kemudian cari kode <data:post.body/> dan ganti dengan kode dibawah 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:left'><b>More about</b> &#8594; <a expr:href='data:post.url'><data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
Keterangan :
450 : Tinggi postingan tanpa gambar.
360 : Tinggi postingan dengan gambar.
120 : tinggi gambar.
150 : lebar gambar.

Tidak ada komentar:

Posting Komentar