√ Cara Gampang Menciptakan Read More Otomatis Pada Blog

     Hey sob? anda punya blog? niscaya sebagian orang mempunyai blog pribadi menyerupai saya ini, banyak orang yang menginginkan tampilan blog yang dimilikinya itu mempunyai tampilan yang lezat untuk dilihat atau tampilannya dinamis, tampilan yang simple serta ringan menciptakan pengunjung tidak sungkan untuk mengunjungi blog anda. Oleh sebab itu saya akan membagikan tips cara untuk menciptakan tampilan blog anda menjadi simple dengan menambahkan fitur Read More pada halaman home page anda.

Read More Otomatis ialah sebuah fitur embel-embel untuk blog semoga tampilan blog yang dimilikinya terlihat lebih simple, dinamis serta yang terpenting itu ringan. Tidak heran kalau anda melihat blog yang di halaman Home Page nya tidak menampilkan artikel sepenuhnya, melainkan dengan meneruskan artikel dengan mengklik Read More. Oke eksklusif saja bila anda ingin menembahkan fitur Read More ke blog anda silahkan simak cara ini.

Langkah Menembah Fitur Read More Pada Blog

1. Buka Blogger anda dan pilih elemen Template, kemudian klik Edit HTML.

2. Lalu centang Expand Template Widget.

3. Selanjutnya cari arahan </head> (gunakan Ctrl+f untuk mempermudah pencarian).

4. Lalu salin coding di bawah ini dan pastekan sempurna diatas arahan </head>.


<script type='text/j4vascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 150;
summary_img = 150;
img_thumb_height = 100;
img_thumb_width = 120;
</script>

<script type='text/j4vascript'>
//<![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>


5. Setelah arahan yang diatas sudah diletakan, selanjutnya cari kode <data:post.body/> dan kemudian ganti kode <data:post.body/> dengan coding yang dibawah ini.


<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/j4vascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span style='float:right'><a expr:href='data:post.url'>Read More</a></span> 
<b:else/>
<data:post.body/>
</b:if>


6. Dan terakhir simpan Tamplate anda dan lihat hasilnya.

7. Selesai.

Oke mungkin itu saja yang sanggup saya berikan mengenai artikel ini, semoga dengan apa yang sudah saya berikan ini sanggup bermanfaat bagi Anda. Jangan lupa untuk like dan follow akun kami untuk mendapat isu serta update terbaru dari kami. Jika ada Kesalahan atau ada Pertanyaan serta Tambahan sanggup isi pada kolom komentar anda. Terimakasih.

Sumber http://www.blogsejutaumat.com/