Membuat Read More Secara Otomatis
di Blog - 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>
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 = "no-float" ;
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 != "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;padding-top:20px;'>
<a
expr:href='data:post.url'> <b>Read more</b>
»»   </a></span>
</b:if>
<b:if
cond='data:blog.pageType == "item"'><data:post.body/>
</b:if>
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.
Demikianlah Tutorial cara Membuat Read More
Secara Otomatis di Blog, semoga bermanfaat. Jangan lupa
Like-nya.
Tidak ada komentar:
Posting Komentar