Membuat Auto Read More Sesuai Dengan Judul Postingan
Masih Behubungan dengan Mendisain Template Blog saya Kali Ini saya Menambahkan Auto Read More Sesuai Dengan Judul Postingan Setelah sebelumya saya Menambahkan Menu Horizontal pada blog Kesayang saya ini, Hehehehee
Nah mari Kita Mulai Membuat Auto Read More Sesuai Dengan Judul Postingan
[-] Pertama Masuk Ke Akun Blogger anda
[-] Masuk Ke Halaman Design / Rancangan
[-] Pilih Edit HTML jangan Lupa Expand Widget Templates
[-] Cari Kode </Head> Untuk Mempercepat gunakan Ctrl + F
[-] Setelah Ketemu masukan Kode Dibawah Ini Di Atas Kode </Head>
<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
</script> summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
<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/> Setelah Ketemu Ganti Kode <data:post.body/> Dengan 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 == "item"'><data:post.body/></b:if>
Keterangan :
[-]var thumbnail_mode = "float"; Berfungsi Untuk memutuskan apakah letak thumbnail berada di (float) kiri atau jika tidak silahkan ganti dengan (no-float)
[-]summary_noimg = 250; Berfungsi Untuk Menetapkan berapa banyak karakter akan ditampilkan di posting tanpa gambar / thumbnail
[-]summary_img = 250; Berfungsi Untuk Menetapkan berapa banyak karakter akan ditampilkan di posting dengan gambar / thumbnail
[-]img_thumb_height = 120; Merupakan Thumbnail 'tinggi dalam piksel)
[-]img_thumb_width = 120; MerupakanThumbnail 'lebar dalam piksel)
Nah semoga Tutorial Membuat Auto Read More Sesuai Dengan Judul Postingan Berguna Untuk Para Blogger Semua,, HappY Blogging
0 komentar:
Posting Komentar