• 12TKJ2 ZONE SMKN 3 BEKASI.
  • 12TKJ2 SMKN 3 BEKASI.
  • 12TKJ2 SMKN 3 BEKASI.
  • 12TKJ2 SMKN 3 BEKASI.
  • 12TKJ2 SMKN 3 BEKASI.
  • 12TKJ2 SMKN 3 BEKASI.
  • 12TKJ2 SMKN 3 BEKASI.
  • 12TKJ2 SMKN 3 BEKASI.
  • 12TKJ2 SMKN 3 KOTA BEKASI.
  • 12TKJ2 SMKN 3 BEKASI.
MOTIVASI KAMI ADALAH MENJADI ANAK YANG BAIK DAN TAAT DI HADAPAN GURU, sebelumnya Thanks to blogger,***

Tuesday, December 14, 2010

Cara membuat auto read more pada blogger

<b></b> Membuat Auto Read More kali ini berbeda dengan yang sebelumnya yaitu cara memberi read more dan cara memberi read more pada posting. <b> Cara membuat auto read more </b> kali ini aku pelajari dari blognya Oom (o-om.com). Berhubung untuk menerapkan ilmunya aku tulis lagi <b>cara membuat auto read more</b> ini dengan tujuan memperfaseh dan memperluas berbagi informasi sesama blogger, khususnya <b>cara membuat auto read more</b> ini. <b> Cara membuat auto read more </b> kali ini agak ruet disbanding <b> membuat read more </b> sebelumnya. <b> Membuat auto read more </b> kali ini memang dibilang lebih praktis karena apa, jika read more terdahulu harus menggunakan cara manual untuk memasang <b> fungsi auto read more </b> tersebut ke setiap posting.
<span class="fullpost">
Tidak kalah menariknya <b> fungsi auto read more </b> kali ini mampu menampilkan gambar pertama dalam sebuah poting. <b> Fungsi auto read more </b> ini bisa dibilang lebih mirip dengan artikel terbaru dengan thumbnail.

Kelebihan yang lain dari <b> fungsi auto read more </b>  kali ini yaitu kita bisa mengatur berapa banyak karakter yang akan  ditampilkan. Ada karakter yang bisa ditampilkan jika ada sebuah gambar  dalam postingan yang anda buat. Dan adapula yang tanpa menampilkan  gambar. Memang <b> cara membuat fungsi auto read more </b> kali ini agak rumit tapi ada sisi positifnya juga yaitu kita tidak perlu lagi <b> membuat fungsi read more pada setiap posting </b>.

Cari kode &lt;/head&gt; kemudian letakan script dibawah ini di atas kode &lt;/head&gt; .
copy paste script <b> auto read more </b> barikut ini:

&lt;script type='text/javascript'&gt;
var thumbnail_mode = "float" ;
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
&lt;/script&gt;


&lt;script type='text/javascript'&gt;
//&lt;![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("&lt;")!=-1)
{
var s = strx.split("&lt;");
for(var i=0;i&lt;s.length;i++){
if(s[i].indexOf("&gt;")!=-1){
s[i] = s[i].substring(s[i].indexOf("&gt;")+1,s[i].length);
}
}
strx = s.join("");
}
chop = (chop &lt; strx.length-1) ? chop : strx.length-2;
while(strx.charAt(chop-1)!=' ' &amp;&amp; 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&gt;=1) {
imgtag  = '&lt;span style="float:left; padding:0px 10px 5px 0px;"&gt;&lt;img  src="'+img[0].src+'" width="'+img_thumb_width+'px"  height="'+img_thumb_height+'px"/&gt;&lt;/span&gt;';
summ = summary_img;
}

var summary = imgtag + '&lt;div&gt;' + removeHtmlTag(div.innerHTML,summ) + '&lt;/div&gt;';
div.innerHTML = summary;
}
//]]&gt;
&lt;/script&gt;

Tetap pada halaman EDIT HTML, Beri tanda centang pada "Expand widget template" kemudian cari  kode dibawah ini

&lt;data:post.body/&gt;

Jika  sudah ketemu, maka ganti kode &lt;data:post.body/&gt; dengan semua kode dibawah ini

&lt;b:if cond='data:blog.pageType != "item"'&gt;
&lt;div expr:id='"summary" + data:post.id'&gt;&lt;data:post.body/&gt;&lt;/div&gt;
&lt;script type='text/javascript'&gt;createSummaryAndThumb("summary&lt;data:post.id/&gt;");&lt;/script&gt;
&lt;span  class='rmlink' style='float:left'&gt;&lt;a  expr:href='data:post.url'&gt;READ MORE -  &lt;data:post.title/&gt;&lt;/a&gt;&lt;/span&gt;
&lt;/b:if&gt;
&lt;b:if cond='data:blog.pageType == &amp;quot;item&amp;quot;'&gt;&lt;data:post.body/&gt;&lt;/b:if&gt;

Setelah selesai tekan save template.

Keterangan tentang <b>cara membuat auto read more</b>:
var  thumbnail_mode = "float";  (kita dapat memutuskan apakah letak  thumbnail berada di (float) kiri atau jika tidak silahkan ganti dengan  (no-float)
summary_noimg = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting tanpa gambar / thumbnail)
summary_img = 250; (Menetapkan berapa banyak karakter akan ditampilkan di posting dengan gambar / thumbnail)
img_thumb_height = 120; (Thumbnail 'tinggi dalam piksel)
img_thumb_width = 120; (Thumbnail 'lebar dalam piksel).

Dengan keterangan di atas anda dapat merubah script <b> fungsi auto read more </b> sesuka hati.
Selamat bereksperimen…  </span>

0 comments:

Post a Comment