Cara Membuat Code READMORE Otomatis di Blogspot

Jika template bawaan anda belum ada fitur Read more atau Baca selengkapnya tidah usah bingung tambahkan saja Script yang akan disajikan dalam Tutorial kali ini. Berikut cara membuat Read More otomatis untuk blog.


Pertama anda masuk dasbord blogger >> lalu pilih rancangan >> Pilih Edit HTML.
Jangan lupa centang Expand Template Widget.
Lalu cari kode </head>  untuk mempermudah pencarian tekan F3.

Masukan kode berikut tepat ditas </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>

Belum selesai, cari lagi 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; </a></span>

</b:if>

<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/>

</b:if>

Sumber : http://media-science.blogspot.com/2012/11/cara-membuat-readmore-otomatis-di.html

Sampai disini lalu save template anda.

Selesai deh, untuk memastikannya coba lihat hasilnya.

Kata Read more warna merah dapat anda ganti dengan kata-kata selera anda, misalnya : Baca selanjutnya Baca selengkapnya, dll.
Bila anda ingin merubah ukuran Read More Pada Blog, Blogspot, Blogger anda, ubah aja di bagian-bagian kode di bawah ini, dan Ubah angka nya sesuai kebutuhan:

summary_noimg = 430; adalah tinggi potongan artikel tanpa gambar
summary_img = 340; adalah tinggi potongan artikel dengan gambar
img_thumb_height = 100; adalah ukuran tinggi thumbnail
img_thumb_width = 120; adalah ukuran lebar thumbnail

Demikianlah Tutorial cara Membuat Read More Secara Otomatis di Blog, semoga bermanfaat. Jangan lupa Like-nya.

Sumber : http://media-science.blogspot.com

apa terjadi KESALAHAN atau read more tidak BERFUNGSI

cllick disini Cara Mengatasi Masalah Halaman Statis Karena READMORE Otomatis