Jika Anda ingin menambahkan fitur auto read more tersebut di blog, Anda bisa mengikuti langkah di bawah ini :
1. Cari kode </head>
Cari kode </head>
lalu paste script ini pada kolom pencarian : </head>
tekan enter untuk mencari script.
2. Tambahkan script CSS
Setelah Anda menemukan script </head>
Tambahkan script berikut di atas script </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>
<a style="display:none" href="https://www.belidesain.com/2023/10/cara-membuat-auto-read-more-di-blogger.html">Cara membuat auto read more di blogger</a>
<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>3. Cari script <data:post.body/>
Dalam sebuah blogger, biasanya terdapat dua, tiga, atau lebih <data:post.body/>, silahkan pilih <data:post.body/> yang ke dua. Kemudian Anda ganti <data:post.body/> dengan script di bawah ini :
4. Tambahkan script HTML
Setelah Anda menemukan script <data:post.body/>, ganti script <data:post.body/> dengan script di bawah ini :
<b:if cond='data:blog.pageType == "static_page"'><br/>
<data:post.body/>
<b:else/>
<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'>read more</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
</b:if>5. Simpan template
Setelah Anda menambahkan script di atas, silahkan Anda simpan template Anda dan lihatlah perubahannya.
Demikianlah cara untuk menambahkan auto read more di blogger, semoga bermanfaat.
Jika ada yang ingin ditanyakan, Anda boleh menghubungi saya secara langsung melalui WhatsApp, insyaaAllah saya akan membantu Anda jika waktu saya senggang. Jangan sungkan ya untuk bertanya.
terima kasih :)
Status : Sudah ditest dan berhasil
Template yang sudah ditest :
