Cara Pasang Read More Otomatis Di Blogger

Diposting oleh Luqman Saputra on Jumat, 06 Januari 2012

Read More adalah untuk memotong tampilan tulisan artikel jadi buka memotong semua tulisan artikelnya tapi Read More hanya memotong tampilan tulisan artikel jadi kalo kamu memasang Read More ini blog kamu tidak akan menghabiskan tempat alias jadi simple. Read More ini juga sangat di sukai oleh Sang google alias temasuk SEO. Apa itu SEO ? Seo adalah Search Engine Optimazation. Ok kita langsung ajah ke tutorialnya.

1. Pertama kamu harus Login ke blog kamu atau ke blogger kamu
2. Pasti kamu masuk ke dasbor. Setelah kamu masuk ke dasbor kamu klik >> Rancangan >> klik lagi Edit HTML. Jangan lupa contreng atau centang Expand Template Widgetnya.
3. Kamu cari kode </head> (Menggunakan Perintah Keyboar CTRL+ F). Setelah kamu menemukan kode </head> Copy kode Script di bawah ini dan Pastekan atau Letakan kode Script di bawah ini tepat di bawah kode </head> :

<!-- Auto read more script -http://dlurblog.blogspot.com- Start -->
<script type='text/javascript'>
var thumbnail_mode = &quot;yes&quot;; //yes-dengan gambar,no-tanpa gambar
summary_noimg = 430;
summary_img = 340;
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://dlurblog.blogspot.com- End -->

4. Nomber yang berwarna merah itu adalah jumlah tampilan Read More. Bisa kamu rubah dengan selera kamu sendiri
5. Kemudian kamu cari kode <data:post.body/> (CTRL + F). Setelah kamu menemukan kode <data:post.body/> Copy kode Script di bawah ini dan ganti kode <data:post.body/> dengan kode Script di bawah ini :
<!-- Auto read more -http://dlurblog.blogspot.com- Start -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&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>
<a class='more' expr:href='data:post.url'>Read More &#8594;</a>
</b:if>
</b:if>
<!-- Auto read more -http://dlurblog.blogspot.com- End -->

6. Yang terakhir Jangan lupa Save Templatenya

Catatan :
Jika kamu ingin mengganti tulisan Read More dengan gambar kamu harus Hapus Read More  yang berwarna merah ganti dengan kode di bawah ini :
<img border='0' src='url (direct link) gambar readmore kamu'/>

{ 0 komentar... read them below or add one }

Posting Komentar