Nah...Judul di Atas yang akan kita bahas dalam tutorial kali ini
Membuat readmore Memang Mudah......Selain mudah kita
Juga Bisa Mengutak - Atik nya.....Nah...Membuat Readmore
Kali ini.....Sama Saja dengan Membuat Readmore yang Biasanya
Namun. .. . .Membuat readmore kali ini Sedikit Berbeda.........
Karena saya Sudah Mengutak - atik Kode nya........Biar Kelihatan Lebih
Indah saja. . . . .Dan kita Juga Pasti senang Bila.......Apa yang kita inginkan
Itu bisa kita Laksanakan.........Nah begitu juga dengan saya.....,,...
saya suka utak -atik Kode html Walau Kadang Selalu salah.......
Tapi saya gak pernah menyerah, saya terus mencoba Hingga Berhasil
Jadi Anda, Jangan Menyerah sebelum Apa yang Anda Inginkan...itu tercapai....
Itu hanya sedikit cerita dari saya....
Untuk Tutorial nya silahkan Ikuti Langkah-Langkah nya di bawah ini
1. Log in ke blog anda
2. KLik Rancangan / Layout
3. KLik Edit HtmL
4. Cari Kode <body>
Dan Letakan kode di bawah ini Di atas kode <body>
<script type='text/javascript'>var thumbnail_mode = "no-float" ;
summary_noimg = 500;
summary_img = 500;
img_thumb_height = 200;
img_thumb_width = 200;
</script>
<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; 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. SimpaN Template
6. Setelah Anda simpan Template Lalu Centang Expand Template widget
Dan Cari Kode di Bawah ini
<data:post.body/>
Setelah ketemu Anda Hapus kode Tersebut dan Ganti dengan Kode 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:right;padding-top:20px;'><a expr:href='data:post.url'><div style='width:200px; height:20px; background:url(http://www.colorhealing.com/green_revolving_star.gif) repeat-x center; color:gray; text-align:center; text-shadow:1px -1px black; font-weight:bold; -moz-border-radius:5px;
-webkit-border-radius:5px; -goog-ms-border-radius:5px;'>READMORE....!!</div></a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/>
</b:if>
7. Simpan Template Anda
Keterangan:
summary_noimg = 500; Artinya Artikel di potong tanpa menampilkan gambar...
summary_img = 500; Artinya Artikel di potong dengan menampilkan gambar...
img_thumb_height = 200; Artinya tinggi gambar...di artikel
img_thumb_width = 200; Artinya Lebargambar...di artikel
width:200px; Adalah Lebar gambar......readmore
height:20px; Adalah Tinggi gambar......readmore
http://www.colorhealing.com/green_revolving_star.gif Adalah gambar background nya anda bisa ganti dengan
Gambar yang anda suka....
READMORE....!! Adalah Kata - kata nya Anda bisa ganti dengan Kata2 Anda sendiri....
Saya kira Cukup Sekian Dari system of blog Saya ucapkan terima kasih telah membaca artikel saya....
Kalau nggak bisa Komen yo......
Tidak ada komentar:
Posting Komentar