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 == "item"'><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
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 + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>
sumber artikel: iskaruji dot com
Thanks atas appresiasinya pada artikel readmore otomatis ini...Keep on spirit. Trus posting and posting sambil terus belajar...happy blogging!
BalasHapus