Demo image Demo image Demo image Demo image Demo image Demo image Demo image Demo image

Cara Membuat/Memasang Auto Readmore Blogger/Blogspot (Plus Thumbnail)

  • Rabu, 09 Mei 2012
  • Febri Rizki




  • Update: 
     Lihat Cara Membuat Auto Readmore (Thumbnails) Blogspot V2 (Penyempurnaan) yang merupakan penyempurnaan dari script auto readmore ini, pengecualian tampilan auto readmore pada halaman statis (static pages) telah ditambahkan.

    Pertama-tama, bapak ibu sekalian, auto readmore memudahkan kita dalam membuat posting. Memasang fitur ini membuat kita tidak perlu membubuhkan kode <!--more--> atau mengklik tanda setiap kali melakukan posting.
    Fitur auto readmore akan mengurangi pekerjaan ini karena secara otomatis semua posting yang muncul di halaman-halaman utama (misalnya home, search query results, tag results, dll) akan terpotong dengan readmore.

    Berikut langkah-langkahnya:
    1. Masuk ke editor template HTML. Download template terlebih dahulu untuk amannya.
    2. centang expand widgets template.
    3. Masukkan script berikut TEPAT SEBELUM tag </head> (gunakan Ctrl+F untuk mencari)
    <script type='text/javascript'>
    var thumbnail_mode = &quot;float&quot; ;
    summary_noimg = 230;
    summary_img = 140;
    img_thumb_height = 100;
    img_thumb_width = 100;
    </script>
    <script src='https://sites.google.com/site/bukarahasiahost/azmeereadmore/azmee-readmore.js' type='text/javascript'/>
    keterangan:
    -summary_noimg = 230; adalah banyaknya karakter yang akan ditampilkan ketika tidak ada gambar di dalam posting anda, anda bisa mengubah jumlahnya.
    -summary_img = 140; adalah banyaknya karakter yang akan ditampilkan ketika terdapat gambar di dalam posting anda, anda bisa mengubah jumlahnya.
    -img_thumb_height = 100; adalah tinggi gambar thumbnail, anda dapat mengubah nilainya.
    -img_thumb_width = 100; adalah lebar gambar thumbnail, anda dapat mengubah nilainya.
     Tapi untuk amannya tinggalkan begitu saja.

    4. Lanjutkan dengan mencari <data:post.body/> (seperti biasa, gunakan senjata Ctrl+F)
    5. Lalu GANTI <data:post.body/> dengan script 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:5px;;float:right;text-align:right;'><a expr:href='data:post.url' rel='bookmark'><b>Read more >></b></a></span>
    </b:if>
    keterangan:
    -padding-top:5px, ganti nilainya untuk membuat jarak dengan tulisan di atas readmore.
    -float:right, ganti right dengan left jika ingin readmore muncul di sebelah kiri.
    -Anda bisa mengganti Read more dengan kata-kata lain misalnya "baca selanjutnya", "Read the rest of this  entry", "Lanjut gan...",  "Monggo dilanjut!", atau apa sajalah...
    Tapi untuk amannya tinggalkan begitu saja.
     
    6. Untuk memastikan hasilnya, jangan di-save dulu. Gunakan preview untuk mengeceknya.
    7. Setelah beres, silakan di-save.
    8. Finished, you've now got auto readmore for blogger.

    from : http://buka-rahasia.blogspot.com/2011/01/cara-membuatmemasang-auto-readmore.html
    Read More >>