colormap

Senin, 08 Juli 2013

Cara Membuat auto ( READ MORE ) pada Blogger

Membuat auto raed more pada blogger

Tepat pada hari ini senin / juli / 2013 hari pertama saya membuat posting pada blog baru saya ini....
dan pada posting perdana saya, saya akan membahas tentang Bagaimana cara membuat auto read pada blogger , kebanyakan blogger yang menginginkan sebuah template hasil karyanya sendiri akan lebih merasa puas daripada memilih template yang sudah di share oleh para master pembuat template....

Dari pengalaman pribadi saya pernah membuat sebuah template sendiri hasilnya cukup lumayan bagus dan cukup puas, namun yang menjadi kendalanya adalah ( Setiap artikel yang di posting penuh/ tanpa adanya READ MORE) padahal read more sangat berguna dan berpengaruh bagi setiap blog.. salah satunya adalah LOADING BLOG. untuk mempermudah pencarian sebuah konten yang di sajikan blog dan mempercepat akan loading, maka diperlukan adanya read more....

Cara memasang auto read more

khususnya tutorial ini adalah untuk para blogger pemula seperti saya ini yang baru dan masih butuh banyak belajar... mari simak langkah langkahnya sebagai berikut......
langkah pertama silahkan login ke blogger
langkah kedua klik template dan klik lagi Edit..
cari sebuah kode </head> dan letakan kode dibawah ini tepat di atas kode </head>
<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 250;
summary_img = 220;
img_thumb_height = 180;
img_thumb_width = 200;
</script>
<script type='text/javascript'>
//<![CDATA[
function removeHtmlTag(b,a){if(b.indexOf("<")!=-1){var d=b.split("<");for(var c=0;c<d.length;c++){if(d[c].indexOf(">")!=-1){d[c]=d[c].substring(d[c].indexOf(">")+1,d[c].length)}}b=d.join("")}a=(a<b.length-1)?a:b.length-2;while(b.charAt(a-1)!=" "&&b.indexOf(" ",a)!=-1){a++}b=b.substring(0,a-1);return b+" [...]"}function createSummaryAndThumb(d){var f=document.getElementById(d);var a="";var b=f.getElementsByTagName("img");var e=summary_noimg;if(b.length>=1){a='<span style="float:left; padding:0px 10px 5px 0px;"><img src="'+b[0].src+'" width="'+img_thumb_width+'px" height="'+img_thumb_height+'px"/></span>';e=summary_img}var c=a+"<div>"+removeHtmlTag(f.innerHTML,e)+"</div>";f.innerHTML=c};
//]]>

</script>
Keterangan: Kode berwarna merah: menentukan berapa banyaknya text yang akan ditampilkan ketika postingan anda tidak menyertakan gambar.Kode berwarna biru: menentukan jumlah text yang di tampilkan ketika postingan anda menyertakan gambar.Kode berwarna orange: Menentukan tinggi dan lebarnya gambar....

Langkah selanjutnya: scrol terus kebawah dan temukan kode <data:post.body/> biasanya kode tersebut ada 2 sampai 3 kode yang sama, sebaiknya coba dulu mulai dari yang paling bawah dan letakan kode ini dibawahnya
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);</script>
<span class='rmlink' style='float:left'><b>Baca Selengkapnya</b> &#8594; <a expr:href='data:post.url'><data:post.title/></a></span>
</b:if></b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
</b:if>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'><data:post.body/></b:if>
Selamat berkreasi.....

1 komentar:

Unknown mengatakan...

Cara menbuat auto read more....

Posting Komentar

 
 
Copyright © 2013: Dilindungi oleh