Mudah Membuat ReadMore Otomatis Di blog - banyak para blogger yang masih bingung untuk membuat readmore otomatis di blog meraka, walaupun banyak sekali artikel yang membahas bagaimana cara membuat
readmore otomatis. Hal ini disebabkan karena banyaknya artikel yang copas padahal si pemilik blog sendiri tidak betul paham dengan caranya, Disini saya akan memcoba menjelaskan cara membuat
readmore otomatis di blog secara detail sehingga blogger pemula sekalipun bisa membuatnya.
Mungkin pemula blogger atau Newbie masih bingung apa itu readmore?, ReadMore adalah penggalan dalam sebuah artikel, biasanya hanya menampilkan beberapa kalimat saja dan biasanya ditandai dengan kata "READMORE", "BACA SELENGKAPNYA", "LANJUTKAN MEMBACA", dan sejenisnya.
Manfaat ReadMore juga untuk mempersingkat atau merapihkan artikel yang panjang jadi potingan artikel anda akan tersusun rapi dengan hanya menampilkan gambar dan beberapa kalimat saja.
Demikian sedikit penjelasan Kita langsung menuju Ke TKP
CARA MUDAH MEMBUAT READMORE DI BLOG
- Silahkan buka template anda Pilih : TEMPLATE >> EDIT
- Cari Kode </head>.
- Copy paste dibawah ini tepat diatas kode </head>.
<script
type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, (for blogspot)
by: http://teknikseomudah.blogspot.com/
********************************************/
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>
- Save Template anda
- Kemudian csroll template anda kebawah cari kode seperti berikut:
Ket : Kata kuncinya adalah didalam kotak hitam "BLOG POST/POSTINGAN"
jika anda menggunakan bahasa indonesia.
- Jika sudah menggunakan kode seperti gambar diatas silahkan klik anak panah kecil warna hitam sebelah kiri.
- Setelah tanda panah kecil di klik maka akan ada tampilan seperti gambar berikut
- Cari kode yang di tandai dengan kotak hitam "POST" VAR ='POST"'.
- Setelah ketemu klik tanda panah yang lurus dengan kode tersebut.
- Selanjutnya akan terbuka kode-kode yang lain.
- Geser atau scroll ke bawah dan cari Kode:
<data:post.body/>
- Setelah ketemu hapus kode diatas dan ganti dengan kode dibawah ini:
<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:left'><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>
- Klik SAVE / SIMPAN Dan lihat Hasilnya
Jika kita baca tutorial cara membuat ReadMore Di blog ini terkesan panjang dan membingungkan, tapi dalam prakteknya ini lebih detail dan paling di jamin
keakuratanya untuk para Bloger pemula karena sudah saya jelaskan diatas bahwa