CARA MEMBUAT READMORE OTOMATIS DI BLOG

       Secara harfiah, ReadMore atau Baca Selengkapnya, memang dibutuhkan dalam sebuah blog. biar yang baca penasaran dan ngeklik halaman yang separuhnya kita sembunyiin itu. Ada dua cara memberikan perintah ReadMore. Pertama, Readmore secara otomatis dan yang kedua, bisa kalian sisipkan saat membuat postingan seperti ini. Kalian tinggal edit HTML di samping Compose dan jadilah ReadMore sesuai tempat yang kalian inginkan,

       Aku lebih memilih memasang Readmore secara otomatis, biar nggak harus bolak balik edit. Dan tentu untuk mempersingkat waktu. Lalu gimana sih cara menyisipkan ReadMore di akun blogspot kita?

       Langkah-langkah memasang ReadMore secara Otomatis 

• Login ke akun blogger.com kalian.
• Pilih Template   ===> "> Edit HTML  ===>  Cari Kode </head>
(Untuk mempermudah pencarian tekan CTRL+F atau F3 pada keyboard

Masukkan Kode di bawah ini tepat di atas 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 tercopy, langkah selanjutnya cari kode <data:post.body/>
•        Biasanya lebih dari satu sih, aku nyoba hapus di dua tempat baru bisa masuk                     Readmorenya. Nah, kode tersebut kalian hapus dan diganti dengan kode di bawah             ini.

<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>

Setelah itu kalian bisa Preview hasilnya. Maka hasilnya akan seperti gambar di bawah ini.

Hasil Script ReadMore

            Nah, sangat mudah sekali kan? Jika tulisan ini bermanfaat, silahkan share sebanyak-banyaknya ya. Mari belajar bersama.