earth

Guestbook

/* Iklan google ads */
Pada bahasan sebelumnya, mengenai auto readmore, saya sudah berjanji akan membahas mengenai cara mengganti readmore versi 1 dan versi 2 dengan auto readmore. Karena bagi beberapa sobat yang sudah terlanjur menggunakan readmore versi 1 atau versi 2, mungkin masih kesulitan jika harus menggantinya dengan auto readmore.

Sebenarnya jika sobat masih ingat kode yang digantikan ketika membuat readmore versi 1 atau versi 2, tidaklah susah untuk mengubahnya menjadi auto readmore ini, karena hanya tinggal menghapus kode-kode tersebut dan menggantikannya dengan kode auto readmore.

Ok deh, untuk lebih jelasnya kamu bisa mengikuti langkah-langkah berikut:
Mengganti Readmore Versi 1 Dengan Auto Readmore
  • Dari dasbor, pilih Rancangan - Edit HTML.
  • Lakukan duplikasi template untuk jaga-jaga jika bermasalah.
  • Beri tanda checklist (centrang) pada Expand Template Widget.
  • Copy script berikut lalu letakkan (paste) di bawah kode </head> (antara </head> dan <body>):
    <script type='text/javascript'>
    summary_noimg = 700;
    summary_img = 500;
    img_thumb_height = 150;
    img_thumb_width = 200; 
    </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(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>
    
    Keterangan:
    summary_noimg = jumlah karakter yang ditampilkan jika artikel tidak memakai gambar (misal: 700 karakter)
    summary_img = jumlah karakter yang ditampilkan jika artikel memakai gambar (misal: 500 karakter)
    img_thumb_height = tinggi gambar thumbnail (misal: 150px)
    img_thumb_width = lebar gambar thumbnail (misal: 200px)
  • Setelah itu carilah kode berikut:
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <style>.fullpost{display:inline;}</style>
    <p><data:post.body/></p>
    <b:else/>
    <style>.fullpost{display:none;}</style>
    <p><data:post.body/></p>
    <a expr:href='data:post.url'>Readmore »»</a>
    </b:if>
    
    Kata Readmore »» mungkin saja berbeda tergantung dulu kamu membuatnya.
  • Ganti kode tersebut dengan kode ini:
    <!-- Awal Readmore -->
    <p>
    <b:if cond='data:blog.pageType != &quot;item&quot;'>
    <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>
    <span class='readmore' style='float:right; font-style:italic'><a expr:href='data:post.url' expr:title='data:post.jumpText + &quot; &quot; + data:post.title'>Readmore...</a></span>
    </b:if>
    <b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>
    </p>
    <!-- Akhir Readmore -->
    
    Catatan:
    Jika mau, kamu dapat mengganti perataan tek sebelah kanan (right) dengan kiri (left), atau mengubah style huruf italic dengan normal. Kamu juga bisa mengganti tulisan Readmore... dengan kata lain atau dengan gambar (image).
  • Simpanlah hasil editing ini dan ucapkan alhamdulillah...
Mengganti Readmore Versi 2 Dengan Auto Readmore
Untuk mengganti readmore versi 2, ikuti saja langkah-langkah seperti pada artikel Menambahkan Auto Readmore Pada Blogspot, kemudian cari lalu hapus kode:
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link' style='text-align:right'>
<a expr:href='data:post.url + &quot;#more&quot;'><data:post.jumpText/></a>
</div>
</b:if>
Jika kamu tidak menghapusnya pun tidak akan menjadi masalah.
Ok, segitu aja sob. Semoga bermanfaat .....
  • Artikel Terkait Dengan HTML Tutorials

    Terimakasih sudah membaca artikel SC Community's Blog

    41 komentar

    Thnks atas tutorialnya kang ...

    Apa kabar kang ? Mohon maaf lahir n bathin ya kang ...

    31 Juli 2011 13.21  

    selamat menunaikan ibadah puasa ya Kang...

    1 Agustus 2011 08.52  

    thanks atas ilmunya..
    selamat menunaikan ibadah puasa, gan..

    2 Agustus 2011 15.33  

    mantab artikelnya, terima kasih atas infonya

    8 Agustus 2011 11.48  

    Untuk membuat readmore.. aku tinggal klik gambar yang ada di entri post (gak tahu namanya sih hehehe)

    12 Agustus 2011 10.50  

    makin sae postnya kang...

    ijin praktekin yah...:)

    14 Agustus 2011 17.25  

    Sangat menguasai coding rupanya, Komentar juga ya di blog saya www.memebee.net

    15 September 2011 14.41  

    makasih banyak Kang sangat membantu sekali..keep posting.

    7 Oktober 2011 23.10  

    mas bagus banget nie templatenya mas.. bagi-bagi done

    14 Oktober 2011 19.15  

    Gan, banner ane kemana nie? padahal banner agan masih saya pasang di blog saya.

    17 Oktober 2011 21.48  

    Blog dan artikelnya bagus, komentar juga ya di blog saya http://ceritaserudewasa.blogspot.com

    28 Oktober 2011 11.32  

    mantab kang, jadi ga cape2 bikin manual tiap pos, kunjungan dari sahabat lama nih :)

    27 November 2011 08.24  

    Artikel yang sangat bermanfaat

    Follow berhasil ke 1087

    Banner berhasil di pasang di blog IKDT Lihat di sini

    By Adie Konoe

    30 November 2011 18.39  

    kunjunjgan awal super telat nih salam kenal...
    :)

    3 Desember 2011 16.16  

    saya selalu bingung mengedit tampilan thumbnail blog saya, tapi untunglah ada info ini. makasih ya kang :D

    8 Desember 2011 03.37  

    artikelnya bermanfaat bos .....
    tapi saya mau tanya bos
    cara membuat daftar isi ..jadi daftar isi iti di tampilkan dalam bentuk posting berdasarkan label ..
    misalnya pada menu software saya ingin menampilkan semua label software misalnya
    jadi kesimpulannya daftar isi itu bukan dalam bentuk detail ditampilkan tetapi dalam bentuk posting kita bos ..
    sekian bos aku mau requits bolehkan bos ,.,,,

    10 Desember 2011 21.46  

    perlu modernisasi ta bos?? tes

    9 Januari 2012 00.22  

    gan tukeran link yuk
    aturannya link ditaruh di halaman utama blog
    link sobat udah ane pasang duluan
    cek ya
    mohon kerjasamanya

    9 Januari 2012 00.25  

    auto readmore fungsinya buat apa si gan? supaya ia menggal secara otomatis ya gan?

    30 Januari 2012 14.28  

    Follow sukses. ditunggu folllowbacknya

    7 Februari 2012 07.38  

    Ditunggu follbacknya gan jika berkenan,.

    19 Februari 2012 02.45  

    Very interesting your posting, thanks for putting up.
    placenta injection

    24 Maret 2012 12.39  

    kunjungan sob ..
    mau bagi-bagi kalimat motivasi sob ..
    "ada kalanya cahaya dalam hidup kita padam namun di nyalakan kembali oleh seseorang.
    setiap dari kita berutang terima kasih yang terdalam bagi mereka yang menyalakan kembali cahaya kita."
    kunjungan balik ya sob .. :)

    9 April 2012 11.24  

    OK good to see- interesting blogs are always sweet! Peace.
    penyakit katarak

    15 April 2012 05.56  

    kunjungan sob ..
    mau bagi-bagi kalimat motivasi sob ..
    "saya belajar menggunakan kata 'tidak mungkin' dengan sangat hati-hati."
    kunjungan balik ya sob .. :)

    18 April 2012 09.25  

    This is a great blog posting and very useful. I really appreciate the research you put into it.Superb!
    produk perawatan wajah

    2 Mei 2012 13.49  

    =========================================
    berbagi Kata Kata Motivasi cuy
    Hidup ini penuh pilihan. Semakin baik keputusan yang kamu pilih semakin baik juga kamu dalam mengendalikan kehidupanmu.
    =========================================

    semoga dapat di terima :D

    11 Mei 2012 10.24  

    I very happy to find this website on bing, just what I was looking for : D also bookmarked
    sheep placenta

    13 Mei 2012 16.41  

    I'm interesting to read, thanks for putting up ^^
    tips kecantikan

    5 Juli 2012 20.17  

    Emang seru edit edit template blog ya kan bang. hohohoho

    7 Juli 2012 10.26  

    I visited this page first time and found it Very Good Job of acknowledgment and a marvelous source of info.........Thanks
    produk anti aging

    11 Juli 2012 06.30  

    I really like this website, Thanks for sharing this information. Keep posting more. :)
    perawatan wajah

    25 Juli 2012 05.39  

    nice information, Keep posting more ^^
    kecantikan

    wajah

    29 Juli 2012 05.24  

    nice information, Keep posting more ^^
    cream pemutih wajah

    7 Agustus 2012 15.48  

    Thanks for your enjoy article.The blog is written in such a way that it is so easy to read and understand....I look forward to more updates. =D
    penyakit katarak

    14 Agustus 2012 07.09  

    I like your article..it's so interesting..thanks for putting up guys :)
    cara merawat wajah

    9 September 2012 10.23  

    I like this website, Thanks for sharing this information. Keep posting more.

    23 September 2012 16.00  

    I very happy to find this website on bing, just what I was looking for : D also bookmarked

    11 Oktober 2012 19.17  

    hey..your article so interesting guys :)

    4 November 2012 17.02  

    Tambahkan Komentar

    • Dimohon untuk tidak mencantumkan link aktif pada komentar sobat.
    • Gunakan Ruang Tanya pada TabView Menu, jika ingin menanyakan sesuatu yang tidak ada kaitannya dengan artikel di atas.
    Kang eNeS

    Terimakasih atas semua apresiasi yang sobat berikan.

    10 Artikel Terbaru

    10 Artikel Terpopuler