Cara Membuat Auto "Read More" di Blogspot ~ Bang Alvin

Membuat Auto "Read More"

Apakah kalian Pengen lebih praktis dalam menggunakan tanda "Read More >>"? dengan memasang Auto Read more kita lebih terbantu untuk mempoting atau mempublish artikel dengan cepat tanpa memberi tanda lagi. Untuk lebih jelasnya langsung aj,

Masuk ke Dahboard --> Design/Rancangan --> Edit HTML.
Download/back up file XML template terlebih dahulu, agar nanti bisa Restore/Mengulang Kembali Seperti semula jika anda melakukan kesalahan, waktu pengeditan.

Copy-paste script berikut tepat DI BAWAH </head> (gunakan Ctrl+F

<br />
<script type='text/javascript'>
var thumbnail_mode = "yes"; //yes-dengan gambar,no-tanpa gambar
summary_noimg = 430;
summary_img = 340;
img_thumb_height = 150;
img_thumb_width = 150;
</script><br />
<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><br />

Kemudian cari <data:post.body/> (gunakan Ctrl+F), Dan
Ganti dengan Code dibawah ini :

<br />
<b:if cond='data:blog.pageType == "item"'><br />
<data:post.body/><br />
<b:else/><br />
<b:if cond='data:blog.pageType == "static_page"'><br />
<data:post.body/><br />
<b:else/><br />
<div expr:id='"summary" + data:post.id'>
<data:post.body/></div>
<script type='text/javascript'> createSummaryAndThumb("summary<data:post.id/>");
</script><br />
<a class='more' expr:href='data:post.url'>Read More >></a><br />
</b:if><br />
</b:if><br />

Note: Ganti Read More >> dengan kata yang kalian Inginkan. Contohnya "Baca Selengkapnya" Atau jika ingin menggantinya dengan gambar, ganti tulisan tersebut dengan url gambar tulisan read more dimana sobat mengupload gambar.

Dengan mengetahui Cara Membuat Auto "Read More" di Blogspot Kita Akan Lebih mudah dan praktis untuk mengepost website kita. Selamat Membaca :D

Salam Saya,

Bang Alvin

Terima kasih telah membaca artikel tentang Cara Membuat Auto "Read More" di Blogspot di blog Bang Alvin jika anda ingin menyebar luaskan artikel ini di mohon untuk mencantumkan link sebagai Sumbernya, dan bila artikel ini bermanfaat silakan bookmark halaman ini diwebbroswer anda, dengan cara menekan Ctrl + D pada tombol keyboard anda.

Cara Membuat Auto "Read More" di Blogspot

Artikel terbaru :