Cara Membuat Readmore, Baca Selengkapnya, Continue Reading Di Blogspot


Mungkin kata atau istilah readmore ini masih asing buat teman-teman yang masih baru berkecimpung di dunia blogging. Dan w
alaupun tutorial cara membuat readmore sudah banyak di tulis oleh sobat-sobat blogger yang lain tetapi sayangnya tutorial yang di suguhkan terkadang tidak mudah untuk dimengerti dan malah membuat bingung.

Tidak dipungkiri memang si empunya blog ini dulu ada kesulitan untuk memasang readmore. Untuk alasan yang demikian maka tidak ada salahnya saya membuat artikel ini sebagai pelengkap untuk mempermudah sobat blogger yang masih baru menggeluti dunia blogging umumnya dan untuk daftar baca'an pribadi jika suatu saat saya melupakannya khususnya.

Readmore adalah suatu pemotongan kalimat pada suatu postingan. Readmore biasanya digunakan untuk menandai bahwa suatu kalimat dalam suatu postingan masih mempunyai kelanjutan. Kegunaan readmore adalah untuk mempersingkat halaman posting yang panjang.

Makna readmore ini meluas dengan sebutan yang sering kita lihat di dunia maya dengan kata-kata seperti next, continue reading atau juga baca selengkapnya, dll. Readmore setahu si empunya blog ada 2 tipe
  1. Readmore otomatis, dan
  2. Readmore manual
Namun pada kesempatan kali ini saya akan membagi tutorial cara membuat readmore otomatis saja , untuk yang manualnya akan saya posting di lain kesempatan.
  • Login dulu ke blogger masing-masing
  • Klik Template
  • Klik Lanjutkan


Akan ada tampilan seperti gambar di bawah ini

  • Centanglah Expand Template Widget (lihat gambar di atas)
  • Carilah kode </head> kemudian letakan kode di bawah ini tepat di atas kode </head> (Saran: untuk melakukan pencarian silahkan tekan tombol Ctrl+F pada Keyboard)



<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>
  • Selanjutnya carilah kode <data:post.body/>, dan 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> readmore</b> »»   </a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/>
</b:if>
  • Kemudian save template
Keterangan :
summary_noimg = 430 adalah jumlah karakter yang akan di tampilkan tanpa gambar
summary_img = 340 adalah jumlah karakter yang akan di tampilkan dengan gambar
img_thumb_height = 100 adalah tinggi gambar dalam ukuran pixel
img_thumb_width = 120 adalah lebar gambar dalam ukuran pixel

Silahkan sesuiakan dengan keinginan.

Selesai

Untuk yang ingin cara memasang readmore manual yang sangat simple dan mudah silahkan baca postingan "cara membuat readmore manual di blogspot"
Next Post Previous Post
2 Comments
  • tips cara kerja
    tips cara kerja 2 September 2020 pukul 20.35

    ternyata kodenya banyak banget, kira kira g' bikin lemot blog itu ya?

  • FORTUNE FAMILY TV
    FORTUNE FAMILY TV 25 Oktober 2021 pukul 11.35

    Kalau cara buat read more 1,2,3...next page,,ada juga ya ??? Butuh info
    https://motivasiibadah2020.blogspot.com/
    https://galeribungarukmanasari.blogspot.com/

    feedback : rukmanasari302@gmail.com
    ThanksπŸ™πŸ™πŸ˜ŠπŸ˜Š

Add Comment
comment url