Rasanya tutorial ini udah banyak di ketahui oleh para sahabat blogger, tapi hanya untuk sekedar sharing aja…apa salahnya….siapa tau ada blogger pemula seperti saya yang masih kebingungan tentang masalah readmore….he…he…he…
Sesuai namanya Readmore versi 3 berbeda dengan readmore versi sebelumnya, yakni versi 1 dan versi 2…karena di readmore versi 1 dan versi 2, kita harus mengatur batas perpotingan text sevcara manual…nah tapi dengan readmore versi tiga atau yang lebih di kenal dengan Read More Automatis + Thumbnail ini bisa menentukan jumlah karakter text yang akan menjadi abstraksi postingan kita…karena itulah di sebut Readmore Automatis..karena kita gak perlu ribet-ribet lagi untuk mengatur posisi perpotongan text dengan meletakkan text sebelum kode <span class="fullpost"> dan sisanya sebelum kode </span>, karena itu udah ketinggalan zaman…he..he…he…
Selain kelebihannya yang otomatis …readmore versi 3 ini juga memiliki kelebihan lain, yakni mampu menampilkan thumbnail dari gambar pertama postingan, untuk mewakili isi dari postingan kita
He..he…he…keren kan…???
Kalau para sahabat blogger tertarik denagan readmore versi 3 ini,
Ikuti aja langkah-langkah di bawah ini :
1. login dulu ke akun Blogger kamu
2. Pilih Layout > Edit HTML
3. Letakkan kode berikut di di bawah kode </head>
<!-- Read more v3 -->
<script type='text/javascript'>
//<![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; margin:0px 10px 5px 0px; padding:0; border-right:2px solid #ccc; border-bottom:2px solid #ccc;"><img src="' img[0].src '" width="' img_thumb_width 'px" height="' img_thumb_height 'px"/></span>';
summ = summary_img;
}
var summary = imgtag '<span>' removeHtmlTag(div.innerHTML,summ) '</span>';
div.innerHTML = summary;
}
//]]>
</script>
<script type='text/javascript'>
var thumbnail_mode = "float";
summary_noimg = 500;
summary_img = 400;
img_thumb_height = 125;
img_thumb_width = 120;
</script>
<!-- Read more v3 end -->
Catatan :
var thumbnail_mode = "float"; = Menentukan posisi thumnail
summary_noimg = 500; = Jumlah karakter bila tidak menggunakan thumbnail
summary_img = 400; = Jumlah karakter bila menggunakan thumbnail
img_thumb_height = 125; =Tinggi thumbnail
img_thumb_width = 120; = Lebar thumbnail
4. Klik Save Template
5. masih ada di kolom Edit HTML, lalu centang Expand Widget Template
6. 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>
7. lalu Save template nya.
Catatan :
Tulisan READ MORE - bisa anda ganti sesuai keinginan kamu .jika kamu ingin mengubahnya ke bentuk gambar…klik aja
[ di sini ]oke deh semuanya dah rebes beres, silahkan di cek aja, gimana tampilan readmore baru kamu…He…he…he…
Selamat mencoba, Semoga berhasil , dan jangan lupa tinggalkan komentar
Software ini juga menawarkan jenis latar belakang yang berbeda (frame), misalnya, bunga, rumput, samudra, kartun, binatang untuk membantu Anda mengambil warna-warni photos.Sebelum mencetak atau menyimpannya dalam komputer, Anda juga dapat mengeidit foto dalam editor foto dengan mengubah warna foto, menyesuaikan warna, ketajaman, warna RGB , flip dan rorate photos.And Anda juga dapat menambahkan gambar dasar dan beberapa wajah lucu seperti ekspresi wajah lucu pada foto.
