Cara Membuat Read more Di Blogger

No Comments
Kali ini saya sebagai ibu rumah tangga, ingin berbagi tips menarik mengenai cara membuat readmore di blogspot. Readmore sediri adalah bagian dari fungsi untuk meminimalis sebuah artikel konten pada halaman blog, supaya terlihat dengan kesan rapi.



Readmore secara otomatis akan memperpendek artikel pada sebuah halaman yang dapat menentukan banyaknya suatu kalimat paragraf pada tampilan halaman depan blog.

Cara Pertama Membuat Readmore di Blog:
1. Login Blogger
2. Pilih setting pada Template - Klik Edit HTML
3. Cari kode <head> pada halaman template blog. (Gunakan CTRL+F untuk mempermudah pencarian)
4. Letakkan kode script dibawah ini sebelum kode <head>

<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 150;
summary_img = 150;
img_thumb_height = 80;
img_thumb_width = 120;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(b,a){if(b.indexOf("<")!=-1){var d=b.split("<");for(var c=0;c<d.length;c++){if(d[c].indexOf(">")!=-1){d[c]=d[c].substring(d[c].indexOf(">")+1,d[c].length)}}b=d.join("")}a=(a<b.length-1)?a:b.length-2;while(b.charAt(a-1)!=" "&&b.indexOf(" ",a)!=-1){a++}b=b.substring(0,a-1);return b+" [...]"}function createSummaryAndThumb(d){var f=document.getElementById(d);var a="";var b=f.getElementsByTagName("img");var e=summary_noimg;if(b.length>=1){a='<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+b[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var c=a+"<div>"+removeHtmlTag(f.innerHTML,e)+"</div>";f.innerHTML=c};
//]]>
</script>

Setelah anda melakukan langkah-langkah seperti diatas, selanjutnya cari kode <data:post.body/> di halaman template anda. Gunakan CTRL+F supaya dapat mempercepat dalam pencarian.

Letakkan kode script dibawah ini di <data:post.body/>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&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;);</script>
<span class='rmlink' style='float:left'> <a expr:href='data:post.url'><b>Readmore</b> &#8594; <data:post.title/></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>
Silahkan setting tulisan Readmore yang berwarna merah sesuka hati anda.

Sekian tips yang telah saya bagikan dalam membuat readmore otomatis pada postingan blog.

Peraturan Berkomentar:
1. Berkomentarlah dengan baik dan sopan
2. Dilarang spam atau junk
3. Jangan pernah mempromosikan link iklan
4. Gunakanlah komentar dengan bahasa yang jelas
5. Sesuaikan komentar anda dengan judul blog

Untuk komentar pertanyaan, saran, atau kritikan yang anda sampaikan kepada saya, akan saya jawab 1 x 24 Jam.

DMCA.com Protection Status