cara memasang readmore otomatis

Pertama-pertama dulu,,, atas karena ane tukar templat,,,, jadi readmore template ini g da,,, jadi ini pasang readmore otomatis jadinya,,,
, fungsi Read More ini mampu menampilkan image pertama dalam postingan dan mem-fload image tersebut di awal paragraf awal, meskipun gambar yang kita letakan berada di tengah atau akhir postingan. Mungki lebih nyaman saya sebut saja dengan fasilitas image thumbnail.

Tidak hanya itu saja, kita dapat juga pengatur jumlah karakter yang ditampilkan. Disini ada 2 pilihan untuk jumlah karakter. Yang pertama, jumlah karakter yang ditampilkan jika ada image yang diikutsertakan dalam postingan dan yang kedua jumlah karakter tanpa image. Masih bingung maksudnya? sama..yang jelasin juga puyeng wkwkwkw  Ya sudah, biar sama2 gak pusing langsung ke tutorialnya saja ok.

Bagi kalian yang pasang reamore lama,,, jadi harus diganti,,, dan g susah pula qk,, )

<div class='post-header-line-1'/>
<div class='post-body'>
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'>Readmore</a>
</b:if>
<div style='clear: both;'/>

OK, kalo sudah tinggal lanjutkan dengan tutorial dibawah.

Ini readmore yang dipasang di template ea gan,,,

Ikuti caranya ea gan,,,, premium

Pertama, masuklah ke rancangan >>> terus ambil EDIT HTML, dan jangan centang explad template widget Cari kode </head> kemudian letakan script dibawah ini di atas kode </head> Kalo sudah, jangan lupa di simpan terlebih dahulu.

Langsung copy paste aja kode dibawah ini:

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

Masih pada halaman EDIT HTML, Beri tanda centang pada "Expand widget template" lalu temukan kode seperti dibawah

Lalu cari kata yang tertera dibawah ini=== cekidot

<data:post.body/>

Kalo sudah, ganti kode <data:post.body/> dengan semua kode dibawah ini

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

silahkan disimpan dan lihat hasilnya :)

Keterangan:

var thumbnail_mode = "float";  (kita dapat memutuskan apakah letak thumbnail berada di (float) kiri atau jika tidak silahkan ganti dengan (no-float)
summary_noimg = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting tanpa gambar / thumbnail)
summary_img = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting dengan gambar / thumbnail)
img_thumb_height = 120; (Thumbnail 'tinggi dalam piksel)
img_thumb_width = 120; (Thumbnail 'lebar dalam piksel)

Selamat mencoba..

Posting ini telah dilihat sebanyak (Beberapa kali)

Baca juga artikel lainya

SITE MAP

• download game hp
• cara pasang menu butang melayang pada blog
• cara memasang kode warna pada blog
• kode warna blog
• cara membuat salamat datang pada blog
• cara membuat kelap-kelip disertai bintang
• cara pasang spoiler pada blog
• Cara Membuat Poster Film Menggunakan Adobe Photoshop
• cara mengganti bagground photo
• membuat gelembung pada photo dengan photoshop
• photoshop online
• tv online
• CARA MEMASANG CHAT MY CHATROLL ,FB,TWITTER
• Tutorial Bikin Footer Footer Bar + Random Post Berjalan
• Panduan Pasang Script Anti Block / Copy Di Blogger
• Cara Mudah Membuat Efek Salju Di Blog
• Pasang Buku Tamu Tersembunyi Di Blogger
• Membuat Menu Serta Sub Menu Tanpa jQuery

blog

• cara pasang music diblog
• cara membikin link bergoyang
• cara membuat kelap-kelip disertai bintang
• cara membuat daftar isi blog
• cara pasang spoiler pada blog
• Tutorial Bikin Footer Footer Bar + Random Post Berjalan
• Panduan Pasang Script Anti Block / Copy Di Blogger
• Cara Mudah Membuat Efek Salju Di Blog
• Pasang Buku Tamu Tersembunyi Di Blogger
• Membuat Menu Serta Sub Menu Tanpa jQuery
• 6 Macam Style Navigasi Halaman Untuk Blogger
• Cara Bikin Tulisan Berjalan Di Address Bar
• Cara Pasang FB Like, Twitter, Google +1 Di Blogger
• Cara membuat Tukar Link Sendiri Pada Postingan Blogspot
• Cara Membuat Spoiler Di Blogspot
• cara membuat template sendiri
• Membuat Menu Melayang Pada Blog
• cara memasang Google Translator
• pelacak ip address
• cara membuat kursor dengan teks

Posted in: blog,SITE MAP