Minggu, 22 Mei 2011

Cara Mudah Memasang Readmore Otomatis Pada Blogspot

Cara mudah memasang readmore otomatis?itu merupakan pertanyaan orang awam seperti saya bagaimana caranya agar tampilan postingan saya tidak terlihat kayak orang gemuk.setelah saya bertanya pada akang iskaruji dot com terjawab sudah bagaimana caranya memasang readmore di blog anda secara otomatis.

 Cara mudah memasang readmore otomatis telah saya peraktekan dan teruji berhasil dengan ini saya akan tampilkan bagaimana akang iskaruji dot com memberikan penjelasan kepada saya.berikut cara iskaruji dot com mengajari saya
langkah pertama  yang harus dilakukan untuk Memasang Readmore Otomatis Pada Blogspot.
Dari Dashboard > Design > Edit HTML > Expand Widget Templates. Selanjutnya, letakkan kode berikut diatas kode </head> pada template blogspot kamu.
 
<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script>


<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, version 2.0 (for blogspot)

(C)2008 by Anhvo

visit http://en.vietwebguide.com to get more cool hacks
********************************************/
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>

Cari kode <data:post.body/> dan ganti kode tersebut dengan kode berikut;

<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:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
 
kemudin simpan di template kamu.

Untuk Hasil yang lebih baik, silahkan untuk mempersonalilasikan tampilan pengaturan readmore otomatis dengan sedikit perubahan ataupun penambahan pada kode-kode berwarna Merah.

itu saja yang bisa saya tampilkan  kalau mo bca baca ataw tanya tanya ketik disini iskaruji dot com
 NB:
Untuk template Deeahzone sendiri ada beberapa pengaturan yang perlu diperhatikan sebelum tips ini bisa berjalan:
  • Ubah angka summary_img menjadi 200
  • Ubah kode READ MORE - <data:post.title/> sesuai dengan keinginan kamu
  • Hapus kode berikut dari dalam template kamu. Pastikan Expand Widget Template
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>
 
 
sumber artikel: iskaruji dot com

1 komentar:

  1. Thanks atas appresiasinya pada artikel readmore otomatis ini...Keep on spirit. Trus posting and posting sambil terus belajar...happy blogging!

    BalasHapus

BismaClix.com - Inovasi Baru PTC Indonesia