Cara Membuat Auto Readmore dengan Gambar dapat dipasang dengan mudah. Cara memasang readmore ini adalah diletakkan di artikel pada halaman utama Anda. Fungsi read more / baca selengkapnya adalah untuk memotong / meringkas sebuah artikel dengan hanya menampilkan beberapa karakter text.
Selain mempersingkat kalimat yang ditampilkan pada sebuah artikel, read
more otomatis akan bekerja secara automatic ke semua artikel posting
yang kita buat. Langsung saja ke cara pembuatan dan pemasangan tools baca selengkapnya di blogspot.
Cara Memasang Auto Readmore dengan Gambar :
1. Login ke blogger.com
2. Pilih Template lalu Edit HTML,kemudian Tempatkan kursos mouse anda di dalam kotak pengeditan template.
3. Tekan CTRL+F, Muncul sebuah kotak lalu Cari kode </head> dan letakkan kode di bawah ini diatasnya.
<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, version 2.0 (for blogspot)
(C)2008 by Anhvo
visit http://en.vietwebguide.com to get more cool hacks
********************************************/
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>
4. Lanjutkan dengan meletakkan kode di bawah ini diatas kode <data:post.body/> :
<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:right'><a expr:href='data:post.url'><img src='http://lh6.ggpht.com/_Kwwy9VyLMKw/S3qDYQZCiRI/AAAAAAAACxA/aXY0neVNzh0/but_readmore.png'/></a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
5. Save Template Anda.
- Anda dapat mengatur penyusunan jumlah karakter dalam readmore tersebut
sesuai dengan yang anda inginkan. ( terletak pada kode warna merah ).
- Untuk mengubah background gambar anda dapat mengganti kode dengan warna biru.
sip deh bookmark dulu kodenya
BalasHapusthank you admin
BalasHapusthe article is very interesting, it helps me and can be used for reference.
hopefully successful admin always.
Obat Aborsi
Jual Obat Aborsi
Obat Aborsi Janin
Obat Penggugur
Penggugur Kandungan
Obat Penggugur Kandungan
Obat Aborsi Cytotec
Obat Abosi 1 Bulan
Obat Abosi 2 Bulan
Obat Abosi 3 Bulan
Obat Abosi 4 Bulan
Obat Abosi 5 Bulan
Obat Abosi 6 Bulan