Pasang Read More Otomatis



Bagi sobat yang sudah memasang Read More manual sebaiknya kodenya di kembalikan dulu seperti semula,

Caranya :



Login ke Blogger

Klik Rancangan Edit HTML


Kemudian cari kode seperti dibawah

Tips : Untuk mempercepat pencarian sobat bisa gunakan tombol Ctrl + F atau (F3)

jika sudah ketemu Hapus kode yang berwarna biru


(Setiap Template mungkin berbeda, jadi tinggal disesuaikan saja)



<div class='post-header-line-1'/>


<div class='post-body'>


<b:if cond='data:blog.pageType == "item"'>

<style>.fullpost{display:inline;}</style>

<p><data:post.body/></p>

<b:else/>



<style>.fullpost{display:none;}</style>


<p><data:post.body/></p>


<a expr:href='data:post.url'>Readmore</a>

</b:if>


<div style='clear: both;'/>


kalau sudah tinggal lanjutkan langkah-langkah dibawah.




Masih dalam halaman Edit HTML cari kode </head> kemudian Copy Script dibawah ini dan Paste di atas kode </head> tersebut


Kalau sudah, jangan lupa di SIMPAN TEMPLATE terlebih dahulu.



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


Masih dalam halaman Edit HTML Beri tanda centang pada kotak di samping tulisan Expand Template Widget lalu temukan kode seperti dibawah :


<data:post.body/>




Kalo sudah 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 &#8594; <data:post.title/></a></span>


</b:if>


<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>



jika sudah selesai SIMPAN TEMPLATE dan lihat hasilnya



Keterangan : Sobat juga bisa menentukan letak thumbnail (gambar), jumlah karakter tulisan baik tanpa maupun dengan thumbnail serta tinggi dan lebar thumbnail pada Postingan dengan cara merubah kode yang berwarna biru di atas.


Berikut penjelasannya :



var thumbnail_mode = "float"; : Letak thumbnail berada di "float" kiri atau jika tidak silahkan ganti dengan "no-float";

summary_noimg = 250; : Jumlah karakter yang akan ditampilkan di posting tanpa gambar / thumbnail;


summary_img = 250; : Jumlah karakter yang akan ditampilkan di posting dengan gambar / thumbnail;

img_thumb_height = 120; : Tinggi thumbnail dalam ukuran piksel;

img_thumb_width = 120; : Lebar thumbnail dalam ukuran piksel;

Read More &#8594; <data:post.title/> : Tulisan Read More bisa diganti misalnya dengan "Baca Selengkapnya" dan apabila anda tidak ingin menampilkan judul dibelakang Read More, sobat bisa menghapus kode Script ini <data:post.title/>




Selamat mencoba.

0 komentar "Pasang Read More Otomatis", Baca atau Masukkan Komentar

Posting Komentar

Jika artikel ini bermanfaat bisa dishare gan, tapi ingat selalu cantumkan sumber jika ingin copas artikel ini