Cara Buat Read More Otomatis di Blogspot

Cara Buat Read More Otomatis di BlogspotDengan membuat Readmore yang otomatis natinya tampilan Home page blog anda akan lebih rapi tidak memanjang turun ke bawah seperti kalau tidak memakai readmore.dan yang lebih unik lagi di text "Readmore" kita bisa menyisipkan sebuah link dari halaman postingan kita yang secara tidak langsung menambah power Seo Kita.Sebagai Media Belajar Seo Blog tidaklah salah jika kita mencoba membuatnya.Berikut Scren Shoot Tampilanya nantinya :

Jika anda Tertarik saya akan bagi tipsnya untuk Buat Readmore
1. Login ke akun blogger
2. Pilih Template kemudian Edit HTML Centang Expant Templat Widget
3. Cari kode Cari kode </head> (gunakan Ctrl+F untuk membantu pencarian),setelah sobat menemukan kode tersebut letakkan kode berikut tepat di atasnya

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; 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>

Kemudian sobat cari kode <data:post.body/>Ganti kode <data:post.body/> dengan kode di bawah 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:right;padding-top:20px;'>
<a expr:href='data:post.url'>
<b> Readmore  →  <data:post.title/></b> </a>
</span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
</b:if>

4. Kemudian Save Template Selesai jika tidak ada kesalahan pastinya anda dapatkan tampilan Read more tersebut.Jika saja sobat mau merubah tampilanya dengan selera anda sendiri berikut keteranganya dari Script di atas.
var thumbnail_mode = "float";: Letak thumbnail berada di “float” kiri atau jika tidak silahkan ganti dengan “no-float”;
summary_noimg = 250;: Jumlah karakter yang akan ditampilkan di posting tanpa gambar / thumbnail;
summary_img = 250;: Jumlah karakter yang akan ditampilkan di posting dengan gambar / thumbnail;
img_thumb_height = 120;: Tinggi thumbnail dalam ukuran pixel;
img_thumb_width = 120;: Lebar thumbnail dalam ukuran pixel;
READMORE-: Tulisan READMORE bisa diganti Contohnya “Seterusnya” atau "Selengkapnya" Sesuka hati sobat.
Demikianlah admin yang lagi bercerita tentang Cara Buat Read More Otomatis di Blogspot Semoga aja Bisa membantu dan bermanfaat.