Anyail Bedeh Beih

Cara Membuat Read More Di Blogspot

login ke dashboard blogger.

*pilih Rancangan »» edit HTML

*Tandai kotak kecil pada tulisan Expand Template Widget.

*Tempatkan script berikut dibawah kode </head>

*Scriptnya

<script type='text/javascript'>
var thumbnail_mode = "no-float" ; summary_noimg = 440; summary_img = 344; img_thumb_height = 100; img_thumb_width = 120; </script>
<script src='http://blogtegal.googlecode.com/files/readmore-otomatis.js' type='text/javascript'/>

Selanjutnya cari kode <data:post.body/> atau kode <p><data:post.body/></p> sama saja.

ganti kode diatas dengan kode berikut »

<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:right; padding-top:20px;'>
<a expr:href='data:post.url'>»» Baca selengkapnya..... </a></span> </b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/> </b:if>

Terakhir Save Template

Generator template dan penyedia kode template

ketemu lagi sobat sobatku tercinta.
kali ini aku mau bagi bagi link download template atau bisa dikatakan generator template blog.
mau?!
kalau mau kamu bisa berkunjung ke pimp my profil disana macem macemnya template ada.
disana nanti kamu tinggal copy kodenya lalu pastekan pada edit html diblogspot kamu.
kamu juga bisa copy kode kode template macho di editor http://editorteks.blogspot.com/
kalau ada yang kurang jelas kamu bisa bertanya dan kalau ada kesempatan nanti akan aku jawab,oke!semoga manfaat.

Cara Membuat Read More atau Baca Selanjutnya

pada artikel Cara Membuat Read More Otomatis dengan Thumbnail di Blogger
saya sudah lengkap membahas Cara Membuat Read More Otomatis dengan Thumbnail di Blogger namun saya akan membahasnya lagi dengan tulisan selain READ MORE karna buat newbie kalau tidak langsung contoh yang siap dicopy paste akan sulit "aku kan juga newbie" jadi tahu bagaimana newbie hehe...
caranya masih sama dengan di artikel Cara Membuat Read More Otomatis dengan Thumbnail di Blogger
Silahkan Login dan masuk
lalu klik Rancangan dan klik Edit HTML
Centang Expand Template Widget
Untuk mempermudah pencarian kode HTML nya anda tekan aja ( CTRL + F )
Cari kode </head> dan kalau sudah ketemu
Tambahkan kode dibawah ini tepat nya diatas kode </head> :

<script type='text/javascript'>
var thumbnail_mode = "float" ;
summary_noimg = 500;
summary_img = 500;
img_thumb_height = 220;
img_thumb_width = 220;
</script>

<script type='text/javascript'>
//<![CDATA[
/******************************************
Auto-readmore link script, version 2.0 (for blogspot)

(C)2008 by Fais

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>
lalu cari kode <data:post.body/> lalu ganti tag <data:post.body/> tersebut dengan kode script di bawah ini :
<b:if cond='data:blog.pageType != "item"'>
<div style=' text-align: justify;' 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'>BACA SELANJUTNYA - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
atau pakek yang lebih aneh,yaitu pakek bahasa madura contohnya:
<b:if cond='data:blog.pageType != "item"'>
<div style=' text-align: justify;' 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'>BECAH SELENGKAPAH - <data:post.title/></a></span>
</b:if>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
Tahap terakhir setelah selesai pengeditan simpan Templete dan lihat aja hasil nya.
pasti keren deh hasilnya hehe...

pantun madura

pantun madura buat orang yang punya tunangan masih kecil.
koceng koros neng atas papan
kajuh bengkal ekrobeng rengngik
lanceng koros benni laguneh korang ngakan
mekereh bekal laguneh gik nikkenik
terjemahan kebahasa indonesia:
kucing kurus ada diatas papan.
kayu bengkal dikerumuni nyamuk.
pemuda kurus bukan karna kurang makan
mikiri tunangan masih kecil.

pantun untuk penutup dari perkataan atau pidato:
kleppon ceththoth guleh mera
sala lopot nyoon sepora
untuk kali ini cukup dulu ya...

artikel lainnya:

Cara Membuat Read More Otomatis dengan Thumbnail di Blogger

ini ilmu untuk newbie seperti aku ini,mungkin diantara kalian ada yang masih newbie seprtiku?silahkan manfaatin artikelku ini deh,menurutku ini cara yang gambang,karna kemaren kemarennya aku sudah coba berbagai cara,tapi aku tidak ngerti ngerti,akhirnya aku mendapatkan tips ini dari blog temanku.
setelah aku coba ternyata bisa,makanya aku ingin berbagi dengan kalian,tidak usah bertele tele ayo lang aja ke cara membuat read more otomatis dengan thumbnail berikut ini:

Silahkan Login dan masuk
lalu klik Rancangan dan klik Edit HTML
Centang Expand Template Widget
Untuk mempermudah pencarian kode HTML nya anda tekan aja ( CTRL + F )
Cari kode </head> dan kalau sudah ketemu
Tambahkan kode dibawah ini tepat nya diatas kode </head> :

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

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>

Jika ingin merubah ukuran read more nya anda ubah aja di bagian bagian kode di bawah ini Ubah angka nya sesuai kebutuhan :

summary_noimg = 430; adalah tinggi potongan artikel tanpa gambar
summary_img = 340; adalah tinggi potongan artikel dengan gambar
img_thumb_height = 100; adalah ukuran tinggi thumbnail
img_thumb_width = 120; adalah ukuran lebar thumbnail
langkah Selanjutnya cari kode <data:post.body/> lalu ganti tag <data:post.body/> tersebut dengan kode script di bawah ini :
<b:if cond='data:blog.pageType != "item"'>
<div style=' text-align: justify;' 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 == "item"'><data:post.body/></b:if>

Kata READ MORE anda ubah saja sesuai dengan kebutuhan kita kayak kata selanjutnya,seterus nya,atau yang lain nya.
Tahap terakhir setelah selesai pengeditan simpan Templete dan lihat aja hasil nya.
semoga bermanfaat ya...dan kalau sukses kabari aku ya...
artikel lainnya:

email is the best
agama
tuhan