Koleksi Berita

Salam..Malam ni mijie akan buat tutorial cara untuk membuat auto read more seperti yang anda lihat pada blog mijie. Ia lebih nampak lebih tersusun dan kemas kerana readmore ini terjadi secara auto tanpa kita setting @ potong perkataan secara manual. Oklah jom trus ke tutorial ini.

Step 1 ::  Login Dashboard => Design => Edit HTML => Klik pada Expand Widget Template.

Step 2 :: Cari code ini </head>

Step 3 :: Copy code dibawah dan paste kan sebelum code yang anda cari tadi.

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

summary_noimg = 430; adalah size post tanpa gambar
summary_img = 340; adalah size post dengan gambar
img_thumb_height = 100; adalah size tinggi gambar
img_thumb_width = 120; adalah size lebar gambar
.
Step 4 :: Cari code ini <data:post.body/>

Step 5 :: Copy code dibawah dan replace dengan code yang anda cari tadi.

<b:if cond='data:blog.pageType == &quot;static_page&quot;'><br/> <data:post.body/> <b:else/> <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 "<data:post.title/>" </a></span> </b:if> <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if> </b:if>

Step 6 :: Klik preview untuk hasilnya. Jika tiada masalah. Boleh lah klik SAVE.

* Anda boleh mengubah perkataan read more dengan perkataan anda sendiri seperti seterusnya, baca lagi, dan sebagainya.
*Jika anda ingin masukkan images read more seperti blog mijie.tukar code read more “<data:post.title/>” dengan yang ini <img align='right' border='0' src='LINK IMAGES’>

Ok siap. kalu ada masalah boleh lah tinggal komen yer..InsyaAllah mijie akan membantu..

Lagi tutorial klik sini yer..