Membuat auto readmore pada blog

Selamat datang di halaman artikel berjudul Membuat auto readmore pada blog dengan Label: Blogger, Percantik blog artikel ini di rangkum dari berbagai sumber yang ada di internet , mudah-mudahan bisa menambah informasi bagi pembaca semua . Kita tidak menjamin ke akurasian isi artikel ini , jangan di jadikan satu satunya acuan untuk mempraktekanya . terimakasih dan selamat membaca .
PASANG IKLAN 1
Readmore digunakan untuk menampilkan sinopsis atau sebagian dari postingan sehingga ketika pengunjung memasuki halaman homepage atau halaman utama akan muncul beberapa pilihan postingan dan dapat memilih atau membacanya salah satu atau semuanya. dengan demikian tampilan halaman utama blog anda akan terlihat simple, tertata rapi dan anda dapat menambahkan widget-widget lainnya pada widget blog anda agar blog anda semakin terlihat menarik.

Berikut cara membuat readmore pada blog sahabat :
  • Masuk ke akun blog anda
  • Pilih >> Rancangan-edit HTML.
  • Centang pada >> Expand Widgets Templates
  • Temukan </head>  dengan cara tekan Ctrl+F dan copas tag berikut </head>
  • Silahkan Block kode diatas dan gantilah dengan kode script dibawah ini :
<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> 
</head>
Keterangan :
kode diatas anda dapat mengubah point berikut:
    1. summary_noimg = 250;: panjang Ringkasan jika tidak ada gambar 
    2. summary_img = 250;: panjang Ringkasan jika memiliki gambar 
    3. img_thumb_height = 120;: tinggi gambar Thumbnail 
    4. img_thumb_width = 120;: lebar gambar Thumbnail
    "jika anda bingung gunakan kode standart diatas"

    • Setelah kode diatas dipasang kemudian anda cari tag berikut <data:post.body/> caranya seperti diatas, gunakan Ctrl+F. 
    • Kemudian sahabat block kode <data:post.body/> dan ganti dengan kode berikut:
    <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> <div style='clear: both;'/>
    <span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'>
    <a expr:href='data:post.url' >Read more ... </a></span> </b:if> </b:if>
    • Save dan cek hompage atau halaman utama blog anda apakah berhasil atau tidak.

    Demikianlah panduan membuat auto readmore pada blog. semoga panduan ini dapat memandu anda dengan benar dan bermanfaat. terimakasih.

    UPDATE 2 April 2014

    Karena saya melihat banyak komentar dari sahabat Newbe/Pemula yang ingin membuat blognya menjadi keren dengan menambahkan auto readmore. Namun banyak yang kurang teliti dalam pemasangannya. saya sudah mencoba kembali tutorial diatas dan ternyata berhasil, Namun masih saja ada yang berkomentar bahwa tutorialnya tidak work dan kodenya dicari gak ketemu. Untuk itu begini saja saya selalu memberi saran pada komentar saya, bahwasanya jika tidak dapat menggunakan script dengan benar maka saya menyarankan untuk mengubah template anda dari template bawaan ke template yang sudah bagus (sudah ada auto readmorenya). Nah saya sudah membahas tentang cara mengubah template blogger tersebut di pembahasan sebelumnya. untuk itu silahkan bagi yang belum bisa memasang Auto Readmore maka Lebih Baik anda membaca tutorial berikut ini : Cara Mengubah Template BlogSemoga kali ini berhasil

    Terimakasih telah membaca artikel berjudul Membuat auto readmore pada blog Mudah-mudahan apa yang telah di sampaikan dalam artikel ini bisa bermanfaat untuk anda , jika anda suka dengan artikel ini silahkan sampaikan pada teman . Jika kurang berkenan silahkan sampaikan pada admin dengan cara memberi komentar di kolom yang telah di sediakan .
    Iklan di sini

    Related

    Percantik blog 7491120605690274646

    Posting Komentar

    emo-but-icon

    Follow Us

    Hot in week

    Recent

    Comments

    Side Ads

    Text Widget

    heheheh

    Connect Us

    item