Cara Membuat Read More Otomatis

Cara Membuat Read More Otomatis:

1. Masuk ke dashboard blogger, klik Template, klik Edit HTML.

2. Klik di mana saja pada area kode, tekan Ctrl + F, akan muncul kotak pencarian.

3. Copy dan paste kode berikut di kotak pencarian, kemudian tekan Enter:

<data:post.body/>

Nanti akan ditemukan lebih dari satu kode. Blok kode yang terakhir.

4.  Replace kode yang sudah diblok tadi dengan kode berikut:

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<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;,&quot;<data:post.url/>&quot;,&quot;<data:post.title/>&quot;);</script>
 <span class='readmore' style='float:right;'><a expr:href='data:post.url'>Read More &#187;</a></span></b:if></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>

4.  Copy dan paste kode berikut di kotak pencarian, kemudian tekan Enter:

</head>

5. Copy dan paste kode berikut di atas kode  </head>:

<script type='text/javascript'>
posts_no_thumb_sum = 490;
posts_thumb_sum = 400;
img_thumb_height = 160;
img_thumb_width = 180;
</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, pURL, pTITLE){
var div = document.getElementById(pID);
var imgtag = "";
var img = div.getElementsByTagName("img");
var summ = posts_no_thumb_sum;
if(img.length>=1) {
imgtag = '<span class="posts-thumb" style="float:left; margin-right: 10px;"><a href="'+ pURL +'" title="'+ pTITLE+'"><img src="'+img[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px" /></a></span>';
summ = posts_thumb_sum;
}

var summary = imgtag + '<div>' + removeHtmlTag(div.innerHTML,summ) + '</div>';
div.innerHTML = summary;
}
//]]>
</script>

<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<style type='text/css'>
.post-footer {display: none;}
.post {margin-bottom: 10px; border-bottom: 1px dotted #E6E6E6; padding-bottom: 20px;}
 .readmore a {text-decoration: none; }
</style>
</b:if>
</b:if>

6. Klik Format Template dan Simpan Template.

Contoh hasilnya:


 (Sumber: http://helplogger.blogspot.com/2012/03/auto-read-more-with-thumbnail-for.html)

Demikian info Cara Membuat Read More Otomatis, semoga bermanfaat bagi anda.

Komentar

Postingan populer dari blog ini

Jalan-jalan ke Jawa Timur Park 1 dan 2

Konflik Ambon

English Day 30 April 2025

Konflik Vertikal dan Horizontal

Konflik antara Adam dan Iblis dalam Al Quran Surat Al A’raaf

Lowongan Guru di SMPIT Nururrahman Depok 2016

Beasiswa Pendidikan S2-S3 dari Badan Amil Zakat Nasional (BAZNAS) dan Dewan Dakwah Islamiyah Indonesia (DDII) sampai 6 Juli 2014