Regi_Adi
Auto Read More merupakan Read More otomatis dengan fungsi yang canggih. Kenapa canggih? Karena Auto Read More dilengkapi dengan pengaturan jumlah karakter yang tampil pada home page blog Anda. Ada 2 pengaturan jumlah karakter yaitu jumlah karakter Read More dengan gambar dan jumlah karakter Read More tanpa gambar.
Kecanggihan yang lain yaitu Read More ini memiliki image thumbnail yang menampilkan gambar pertama pada postingan blog Anda dan memunculkannya pada awal paragraf.
Jika Anda belum mengetahui apa itu Auto Read More, Anda bisa melihat read more pada home page dari blog Kumpulan Tutorial Ngeblog. Itu merupakan Auto Readmore dengan image thumbnail.
Udah ngga sabar nih menunggu tutorial cara membuat auto read more?? Hehehehehe...
Silakan Anda simak cara membuat auto read more berikut ini
Langkah 1
Login ke akun Blogger milik anda > Tata Letak > Edit HTML. Klik Download Full Template untuk membackup template blog Anda.
Beri tanda centang pada "Expand widget template" kemudian CoPas kode berikut ini di atas kode </head> (tekan Ctrl+F untuk mempermudah dalam pencarian kode)
<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>
Anda bisa memodifikasi kode berikut ini
var thumbnail_mode = "float";
summary_noimg = 250;
summary_img = 250;
img_thumb_height = 120;
img_thumb_width = 120;
Ganti angka summary_noimg untuk mengatur jumlah karakter yang tampil pada kutipan artikel tanpa gambar.
Ganti angka summary_img untuk mengatur jumlah karakter yang tampil pada kutipan artikel dengan gambar.
Ganti angka img_thumb_height untuk mengatur tinggi gambar yang tampil pada kutipan artikel.
Ganti angka img_thumb_width untuk mengatur lebar gambar yang tampil pada kutipan artikel.
Langkah 2
Cari kode <data:post.body/> lalu ganti dengan kode berikut 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</a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
Ganti kata yang berwarna biru dengan left untuk menampilkan link readmore di bagian kiri dan right untuk menampilkan link readmore di bagian kanan.
Ganti kata yang berwarna merah dengan kata yang Anda suka. Misalnya Baca Selengkapnya atau Baca Selanjutnya.
Langkah 3
Klik tombol Pratinjau untuk melihat hasil. Jika hasil sudah sesuai, klik tombol Simpan.
Posted in 
35 Response to "Cara Membuat Auto Read More"
Brkunjung sob, wah lma ga Update niy ;-), mantap sob tutorx..
Blogku gak aku pasang auto read more sob, dulu pernah nyoba, tampilannya malah jadi lucu... hahaha...
blog saya sudah ada auto readmore nya,tapi baru ni tau cara buatnya. Thanks sob.
blog ku sudah auto read more juga. ...
tapi dari dulu ingin kukurangi jumlah kata yang ditampilkan pertama ...
dan ternyata ada disini tutornya ....
mantap tutorialnya
Mantab ni tutorial
kok template saya yang baru sudah ditanam auto readmore ya?
he he he he ga' perhatikan pas nyari kemarin
simpen dulu nih..... siap di praktekin
terima kasih kawan
kunjungan rutin sob,,,,
wah,,info menarik nih.
kalau saya pakai cara default dari editing blogspotnya :)
mungkin ini detailnya ya sob :)
dari kmarin ngutak ngatik gak jadi2 Gi.. :(..
thnks infonya... (^_^)
siip gan...
BERKUNJUNG KANG
Mantab gan,, saya juga sudah pake nih...
Aku simpan templatenya kawan.mungkin aku berminat ntar
Rawan tidak ya kalau dimasukkan ke edit html.Maksudku mempengaruhi yang lain tidak gitu
iNfo yang bagus kawand,,
lanjutkan..
kalo arfi pakai draft.blogger aja.. jadi kalo mau readmore tinggal klik jump break ke awal paragraf postingan yang mau dihilangkan dari homebase blog.. lebih gampang daripada html yang njelimet banget...
Thx ya sob.. :)
Terima kasih infonya sob...
Bisa di coba nich :D
Salam sukses selalu ya...
saya dulu pake auto readmore, tapi itu auto readmore nya bawaan dari templatenya...
dan sekarang gak pake, karena menurut saya lebih enak begini, jadi bisa nentuiin bagian mana yang harus di sembunyikan..
tapi, makasih yah mas atas tutorialnya, ni tutorial siapa tau bisa dijadiin bahan referensi dan juga saya jadi tambah ilmu baru. :)
ehem di blogspot ada yg otomatis tuh di menu postingannya sob...
but, nice info...:)
Saya bingung mau pake juga soalnya dah pake model lama, yang ditulis ditiap postingan
kalo diganti apa ga bermasalah ya ?
trims atas infonya ^^
mampir baca tutorial bagus
boleh juga sih, saya sedang pertimbanhkan juga yan ini :)
Nice post,.. thangs..ijin copy 'n salam kenal
makasih...
manfaat....
Tidak ketemu kode </head> dilangkah pertama.?
Truss klo kode gak ketemu gmana donk mas, pengen nich bisa read more otomatis.
Thx ya mas
Mantapz nich info na.
patut coba nich.
Gak bisa bro...
Tapi thx y atas info na, jadi tambah ilmu nich.
^_^
Trim's sob tutorialnya, semoga dapat bermanfaat bagi pengunjung blog sobat.
Kunjungan baliknya ya sob..
Salam Sukses Selalu
:X ga ngerti boss.. uyeng-uyengan....
nih baru yang aku cari, tapi binun cara prakteknya bos.
Posting Komentar
Silakan menyampaikan kritik, saran dan komentar.