2009-08-16

Memasang auto read more pada blogger

Auto read more adalah read more yang otomatis memotong artikel kita tanpa harus memasang tag <div class="fullpost">..</div> ataupun <span id="fullpost">..</span> sangat praktis bukan? Nah, untuk membuatnya ikuti langkah berikut.
1. Login ke Blogger.com
2. Masuk ke Layouts -> Edit HTML jangan centang expand widget template.
3. Cari kode </head> bisa menggunakan F3, kalau sudah ketemu langsung copy paste kan script dibawah ini tepat di atas kode </head> tadi.

<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[
/******************************************
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("<")!=-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>

5. Simpan pekerjaanmu
6. Masih pada Edit HTML centang Expand Widget Template
7. Cari kode seperti ini <data:post.body/> kemudian ganti dengan semua 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 -
<data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>


Keterangan:

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)
source:http://www.o-om.com/2009/04/cara-pasang-auto-read-more-terbaru-part.html

18 komentar:

Unknown on 17 August 2009 at 13:45

Aloha,tukeran link yo?

Danue354 on 22 August 2009 at 14:34

thaks infonya,sudah tak coba tapi kok postinganya masih panjang yaa,belum teringkas?
kasih saran donk
http://green-myworld.blogspot.com

Aditya Ramadhan on 22 August 2009 at 16:50

@mas danue: maaf mas, scriptnya ada yg error tp udah di fix koq...
skrg udah bisa lg...silahkan di coba.

Jetco Translator on 25 August 2009 at 22:44

tukeran link yuk http://jtsindonesia.co.cc
Jetco Translation Service
Penerjemah Resmi dan Tersumpah

affanibnu on 27 August 2009 at 10:41

lama gak jumpa.. :D

arblogz on 9 September 2009 at 10:20

bagus nih infonya

Basri Muda on 7 October 2009 at 09:12

Tks banget tispnya mas. numpang minum ya. sekalian mau nanya ni, cara menampilkan semua bagian dari posting kita gmana ya?
http://adenapps.blogspot.com

Ahmanie on 8 October 2009 at 21:26

Mantap boz tutorial nya
Mantap lg klo bisa di backlink....
OK boz.......

ephyn on 7 December 2009 at 15:00

thx..setelah gagal teyuz mencoba kode2 itu di laen bentuk..alhamdulillah,resep mas adhiet muanjur! =)

komen di blogku ya..fren..

http://www.hienviro.blogspot.com

B'ryant on 30 December 2009 at 21:06

Maaf, di blogku < bieith.blogspot.com > pada Edit HTML nya koq ndak ada ????

Taman Sebuah Hati on 13 January 2010 at 05:22

setelah keliling cari auto read more akhirnya yg ada di blog ini yg bisa digunakan...,thx teman...

Satanic Immortal on 18 January 2010 at 21:25

Mlm..
Mau nanya..
Kalo templatenya sudah pake Widget social bookmark, kira2 masih bisa gak dipasang auto read more ini..
Maksudnya berpengaruh gak ya dg mengganti code <data:post.body...
Sebelum dan sesudahnya Terima kasih.

hansbacara on 24 March 2010 at 13:53

good.thanks atas infonya

bagosbanget on 11 July 2010 at 16:40

Keren om. Tak coba dulu ya di blogspotku.

Ridwan Padillah on 15 November 2010 at 15:07

[ASK] mas, ko kalo di page jadi ikut2an ada readmore nya..
terus ga ilang ilang lagi..
thx!!

diskon gila disdus.com on 5 December 2010 at 22:27

makasih ummmm.... tips auto readmorenya...

Dicky Hardyastari on 9 May 2011 at 10:24

info yg sangat brguna. makasih yah

日月神教-向左使 on 9 July 2015 at 09:48
This comment has been removed by the author.

Leave a Comment

Silahkan menuliskan komentar anda pada opsi Google/Blogger untuk anda yang memiliki akun Google/Blogger.
Silahkan pilih account yang sesuai dengan blog/website anda (LiveJournal, WordPress, TypePad, AIM).
Pada opsi OpenID silahkan masukkan URL blog/website anda pada kotak yang tersedia.
Atau anda bisa memilih opsi Nama/URL, lalu tulis nama anda dan URL blog/website anda pada kotak yang tersedia.

Jika anda tidak punya blog/website, kolom URL boleh dikosongkan.
Gunakan opsi 'Anonim' jika anda tidak ingin mempublikasikan data anda. (sangat tidak disarankan). Jika komentar anda berupa pertanyaan, maka jika anda menggunakan opsi ini tidak akan ditanggapi.