Cara membuat read more (baca selengkapnya) di blogspot
Cara membuat read more di blogspot- Sekarang saya akan memberitahukan cara membuat read moredi blog untuk post blog anda. read more adalah salah satu agar tampilan halaman sebuah blog bisa lebih simple dan enak dilihat dengan cara memberi pengalan pada setiap artikel baik secara otomatis atau cara manual mungkin para pembaca sudah banyak yang tahu tentang read more. Read more atau baca selengkapnya adalah sebuah kode atau script yang berfungsi memotong sebagian artikel untuk menghemat ruangan dan sekaligus memberikan link yang apa bila di klik akan menuju ke artikel/post.
langsung saja tutornya:- Pertama masuk ke dasbor blog anda www.blogger.com
- Lalu masuk ke 'Rancangan' dan pilih menu 'Edit HTML'
- Klik "EXPAND WIDGET TEAMPLATE"
- cari kode </head> dengan menggunakan CTRL+F
- lalu masukkan kode ini dibawah 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>
<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>
*tulisan berwarna merah dapat kamu ganti sesuai kesukaan anda
- Selanjutnya, cari kode HTML <data:post.body/> atau <p><data:post.body/></p>
- ganti kode di atas 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>
- finish, save teamplate anda
*ket:
tulisan yang berwarna merah dapat anda ganti sesuai keinginan anda
sekian berbagi ilmu dari saya, terima kasih :D
Tutorial by wiwiedyat.blogspot.com
0 comments:
Post a Comment
poskan komentar bila anda mendapatkan informasi dari blog ini.. atau ada yang ingin di tanyakan..