Review http://ilmupengetahuanunik.blogspot.com on alexa.com

Membuat Read More di Blog

Script membuat read more(baca selengkapnya) sangat lah penting untuk para bloggers, terutama dalam mempercantik tampilan blog, dengan script lama dan menggunakan cara baru yang lebih mudah untuk blog desain 2013, tanpa basa-basi lagi to the point aja....
Sebelumnya cadangkan template untuk menghindari script eror

1. Login ke Blogger > Template > Edit HTML.
   Kemudian tempatkan kursor dibagian pengeditan template dan klik salah satu script, lalu tekan CTRL+F untuk melakukan pencarian.
2. Cari kode </head> , kemudian copy dan pastekan script berikut tepat diatas kode </head> :

<script type='text/javascript'>
var thumbnail_mode = &quot;float&quot; ;
summary_noimg = 250;
summary_img = 220;
img_thumb_height = 120;
img_thumb_width = 220;
</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>

 text berwarna merah merupakan banyaknya karakter huruf yang ditampilkan pada postingan tak berfoto
test berwarna orange merupakan banyaknya kareakter huruf yang ditampilkan dengan foto
text dengan background merah untuk mengatur ukuran foto yang ditampilkan




3. kemudian, search lagi <data:post.body/> cariy ang ke tiga pada template anda, kemudian hapus dan gantikan dengan kode berikut :

<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>



Test berwarna merah tersebut dapat diganti dengan apa saja.
4. Jika sudah klik Partinjau untuk melihat hasilnya, sebagai contoh. blog saya menggunakan cara ini.
5. Jika anda suka/bisa save dan nikmati hasilnya...

0 komentar:

Posting Komentar