Rizky c7Indonesian Cheater and Editor Creative
Rizky On Kamis, 22 Maret 2012


Kali ini saya akan share tentang cara membuat readmore dengan image
tampilan ini juga dapat membuat tampilan blog anda menjadi menarik dan lebih indah dilihat :D

Ok langsung aj cara pembuatan nya
- masuk blogger
- klik rancangan
- edit html
- centang expand template widget
- lalu cari </head> dan paste kode di bawah ini tepat di atas kode </head>

<!-- Auto read more script -http://rizky-black-ops.blogspot.com- Start -->
<script type='text/javascript'>
var thumbnail_mode = &quot;yes&quot;; //yes-dengan gambar,no-tanpa gambar
summary_noimg = 430;
summary_img = 350;
img_thumb_height = 150;
img_thumb_width = 150;
</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(thumbnail_mode == "yes") {
    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>
<!-- Auto read more script -http://rizky-black-ops.blogspot.com- End -->

- lalu setelah sudah di paste cari <data:post.body/> lalu ganti dengan kode berikut
 <b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<div expr:id='&quot;summary&quot; + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<div style='clear: both;'/><span style='padding-top:2px;;float:right;text-align:right;'><a expr:href='data:post.url' rel='bookmark'><b><img border='0' src='https://lh3.googleusercontent.com/--ggxKsG6nng/T1MRjH9bGRI/AAAAAAAAALg/wdhkOKi7QJE/w143-h57-k/cooltext656077479.png'/>&gt;&gt;</b></a></span>
</b:if>

- Url Warna merah ganti dengan url gambar kamu
- Selesai :D

Leave a Reply

Subscribe to Posts | Subscribe to Comments

Tukar Link

BLack ops

My Blog List

Chrome Pointer
Gunakan Google Chrome Untuk Tampilan Terbaik Pada Blog ini