Cara Membuat Readmore Otomatis di Blogspot

Mungkin Templat pada Blog anda belum pakai Readmore atau mungkin sobat pernah Membuat tapi gagal.seperti yang pernah saya alami?jika benar jangan putus asa sobat saya pun pernah juga mengalaminya.jadi anda tidak sendiri dalam hal ini.Sekarang admin sudah berhasil membuatReadmore  Otomatis yang berguna memotong tampilan postingan kita supaya Terlihat Rapi Pada saat ada di halaman Home Page.dan ditambah lagi kita bisa menyisipkan Judul Postingan Blog yang secara tidak langsung itu bisa menambah power Seo Kita.

Berikut Cara Membuat Readmore Otomatis di Blogspot :
1.Login ke blogger (Sebaiknya Back-up dulu templat anda jadi jika nanti gagal tinggal Upluad lagi)
2. Masuk Kedalam Menu TEMPLAT Anda
3. Pilih Edit HTML.
4. Centang tulisan "expand template widget".
5. Lalu cari kode </head> : ( untuk mempermudah pencarian Gunakan CTRL dan F Sebagai Bantuanya.
6. Lalu masukkan code di bawah ini tepat di atas </head>

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

6. 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</b> &#187;&#187;&#160;&#160; <data:post.title/></a> </span> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/> </b:if>

7. Kemudian Save Template anda Selesai.
Untuk keterangan Readmore Di atas Sebagai Berikut :
var thumbnail_mode = "float"; : Letak gambar / thumbnail berada di “float” kiri atau jika tidak suka silahkan ganti dengan “no-float”;
summary_noimg = 250; : Jumlah karakter yang akan ditampilkan di posting tanpa adanya 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 misalnya dengan “Baca Selengkapnya” “Selanjutnya” terserah sobat. dan apabila anda tidak ingin menampilkan judul dibelakang Readmore, sobat bisa menghapus code script ini <data:post.title/> yang ada di belakang tulisan Readmore.

random post