Cara Membuat Read More Otomatis pada Blogger

Advertisement

Membuat read more memang kadang susah-susah gampang, pada kesempatan ini akan membahas tentang read more pada blogger baru kalau yang lama biasanya pada saat postingan kita sisipi kode readmore, kalau yang otomatis tanpa sisipin kode lagi dah otomatis dan otomatis bisa terlihat gambar pada postingan walaupun letak gambar berada di bagian bawah postingan tetap akan terlihat contohnya seperti disamping ini.
 langsung saja pertama yang harus dilakukan adalah membuka accaunt blogger

• cari kode </head>
• copy kode dibawah ini 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, 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>

• setelah itu klik simpan / save
• kemudian klik tanda centang pada Expand Widget Templates cari kode <data:post.body/> ganti dengan kode berikut :

<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 == &quot;item&quot;'><data:post.body/></b:if>

•  kemudian di simpan/save

Nb. kode yang berwarna merah
summary_noimg = 250 : banyaknya karakter akan ditampilkan di posting tanpa gambar / thumbnail)
summary_img = 250: banyaknya karakter akan ditampilkan di posting dengan gambar / thumbnail)
img_thumb_height = 120 : (tinggi gambar)
img_thumb_width = 120 : (lebar gambar).

bisa disesuaikan dengan selera anda salam sukses

Peringatan :

Terimah Kasih Telah Membaca Artikel Cara Membuat Read More Otomatis pada Blogger. Artikel Ini Dilindungi oleh DMCA.Jadi Jika Anda ingin Copas Artikel ini, Tolong Dengan LINK SUMBER

INI LINK SUMBER NYA :

<a href="https://rijalulghod.blogspot.com/2010/02/cara-membuat-read-more-otomatis-pada.html" target="_blank">Cara Membuat Read More Otomatis pada Blogger</a>

Title: Cara Membuat Read More Otomatis pada Blogger
Posted By :Santri Ndeso
Pada :2010-02-21T19:41:00+07:00
Rating : 3.5
Reviewer : 99 Reviews
Cara Membuat Read More Otomatis pada Blogger

Artikel Terkait