Tampilkan postingan dengan label readmore. Tampilkan semua postingan
Tampilkan postingan dengan label readmore. Tampilkan semua postingan
Kamis, 28 Agustus 2014
Cara Memasang Auto ReadMore Terbaru
Auto ReadMore..Kaya gimana sih...? Nah silahkan anda lihat gambar dibawah untuk lebih jelasnya :

Nah dan kelebihan Auto readmore Terbaru ini mampu menampilkan image pertama dalam postingan dan mem-fload image tersebut di awal paragraf awal, meskipun gambar yang kita letakan berada di tengah atau akhir postingan. bagaimana cara membuatnya...?Ok langsung aja yu...!!!
Login >> Rancangan >> Edit HTML >> Expand Template Widged >> Download Template Lengkap untuk jaga-jaga>> Cari kode </head>:
Kemudian Copas Kode dibawah ini diatas kode tersebut :
Ok, Lalu cari kode ini <data:post.body/> dan kalo sudah ketemu ganti kode tersebut 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 - <data:post.title/></a></span>
</b:if>
<b:if cond=data:blog.pageType == "item"><data:post.body/></b:if>
Terakhir, Simpan dan lihat hasilnya...
KETERANGAN :
ganti kode yang berwarna biru dengan kata-kata anda..misalnya kalo di blog saya "Baca Selengkapnya"
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)
ReadFull Article ..

Nah dan kelebihan Auto readmore Terbaru ini mampu menampilkan image pertama dalam postingan dan mem-fload image tersebut di awal paragraf awal, meskipun gambar yang kita letakan berada di tengah atau akhir postingan. bagaimana cara membuatnya...?Ok langsung aja yu...!!!
Login >> Rancangan >> Edit HTML >> Expand Template Widged >> Download Template Lengkap untuk jaga-jaga>> Cari kode </head>:
Kemudian Copas Kode dibawah ini diatas kode tersebut :
<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>
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>
Ok, Lalu cari kode ini <data:post.body/> dan kalo sudah ketemu ganti kode tersebut 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 - <data:post.title/></a></span>
</b:if>
<b:if cond=data:blog.pageType == "item"><data:post.body/></b:if>
Terakhir, Simpan dan lihat hasilnya...
KETERANGAN :
ganti kode yang berwarna biru dengan kata-kata anda..misalnya kalo di blog saya "Baca Selengkapnya"
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)
Sumber : http://forantum.blogspot.com/
Langganan:
Postingan (Atom)