Kembali lagi di SMB JAGASATRU Blog. Pada kali ini saya akan membahas tentang Cara Membuat Readmore Otomatis Di Blog. Tombol Readmore / More About / Baca Selanjutnya yang kita bahas ini hanya Dengan Tulisan saja Bukan Gambar. Namun, jika anda ingin membacanya, waktu luang saya akan membuatnya secara rinci dan singkat. Oke, kembali ke topik, Membuat Readmore Otomatis berada pada blog anda sangat mudah sekali, dengan hanya mengikuti Tutorial yang ada di ViperGoy kalian akan bisa. Oke dari pada banyak basa basi kita lanjut ke Topik Utamanya. Cekidott.....
Cara Membuat Readmore Dengan Tulisan :
1. Buka >> www.BLOGGER.com
2. Klik Menu Dropdown
3. Pilih Template
4. Kemudian Klik " Edit HTML "
5. Setelah itu, Copy Kode HTML dibawah ini dan Paste Diatas Kode </head>
<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 220;
img_thumb_height = 120;
img_thumb_width = 220;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(b,a){if(b.indexOf("<")!=-1){var d=b.split("<");for(var c=0;c<d.length;c++){if(d[c].indexOf(">")!=-1){d[c]=d[c].substring(d[c].indexOf(">")+1,d[c].length)}}b=d.join("")}a=(a<b.length-1)?a:b.length-2;while(b.charAt(a-1)!=" "&&b.indexOf(" ",a)!=-1){a++}b=b.substring(0,a-1);return b+" [...]"}function createSummaryAndThumb(d){var f=document.getElementById(d);var a="";var b=f.getElementsByTagName("img");var e=summary_noimg;if(b.length>=1){a='<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+b[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var c=a+"<div>"+removeHtmlTag(f.innerHTML,e)+"</div>";f.innerHTML=c};
//]]>
</script>
6. Setelah itu, Cari Kode HTML <data:post.body/> dan Ganti Kode tersebut dengan Kode dibawah ini :
<b:if cond='data:blog.pageType != "item"'>
<b:if cond='data:blog.pageType != "static_page"'>
<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:left'><b>More About</b> → <a expr:href='data:post.url'><data:post.title/></a></span>
</b:if></b:if>
<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
</b:if>
<b:if cond='data:blog.pageType == "static_page"'><data:post.body/></b:if>
7. Save dan Selesai sudah.
0 comments:
Post a Comment