Tips Membuat Read More Otomatis Blogspot

Tips membuat read more otomatis blogspot yang mudah, simple dan works tenan. Sebelum memulai seperti biasa untuk memperpanjang kata kita harus tahu dulu apa itu read more dan bagaimana cara kerjanya. Read more adalah istilah yang digunakan di dunia website dan blog yang digunakan untuk membatasi tampilan artikel pada halaman utama atau homepage umumnya, dan pada halaman kategori serta halaman hasil pencarian khususnya. Tanpa adanya read more ini, semua artikel yang ada akan terbuka di halaman-halaman diatas yang menyebabkan website atau blog menjadi memanjang, kurang menarik, kesannya seperti web blog satu halaman.

Related Artikel - Tips Membuat Social Media Share Artikel Blogspot

Ok, untuk lebih memahami langsung saja kita praktik, berikut langka-langkahnya:

1. Pastikan sudah masuk ke akun blogspot anda, jika belum monggo login dulu. :)
2. Pilih menu "Template"
3. Pilih "Edit Template"
4. Gunakan CTRL+F, Cari kode </head>
5. Kalo sudah ketemu, monggo copy script CSS dibawah ini, dan paste tepat diatas kode </head>
   
   
   <script type='text/javascript'> var thumbnail_mode = "no-float" ; summary_noimg = 500; summary_img = 250; img_thumb_height = 100; img_thumb_width = 100; </script> <script src='http://script-bamz-us.googlecode.com/files/read-moreotomatis.js' type='text/javascript'/>


6. Kemudian gunakan CTRL+F untuk cari kode <data:post.body/> atau <p><data:post.body/></p>
7. Jika kode tersebut lebih dari satu maka replace kode yang pertama dengan script dibawah ini
   
   
       <b:if cond='data:blog.pageType != "item"'>

       <div expr:id='"summary" + data:post.id'><data:post.body/></div>

       <script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");

       </script>

       <span class='rmlink' style='float:right;padding-top:20px;'>

       <a expr:href='data:post.url'><img src="http://lh3.ggpht.com/_kTaFrEr_318/SkKGIoU-oPI/AAAAAAAAA9g/5A_nTHvFgiI/readmore_thumb%5B2%5D.gif"></img></a></span>

       </b:if>

       <b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>

Kemudian klik save untuk menyimpan perubahan. selanjutnya kita bongkar dulu maksud dari kode javascript diatas:

1. summary_noimg = 500; Jika artikel yang bersangkutan tidak memiliki picture maka yang akan tampil pada halaman depan adalah textnya saja sebanyak 500 huruf
2. summary_img = 250; Jika artikel yang bersangkutan memiliki picture didalamnya, maka yang yang ditampilkan adalah picture itu sendiri dan text sebanyak 250 huruf
3. img_thumb_height = 100; Tinggi picture yang jadi thumbnail di homepage
4. img_thumb_width = 100; Lebar picture yang jadi thumbnail di homepage

Nilai-nilainya bisa diganti sesuai kebutuhan agan sekalian, kemudian untuk icon read morenya jika kurang cocok, agan tinggal replace URL yang dibold itu dengan URL icon milik agan, atau bisa langsung cari inspirasi di Google Image.

Related Artikel - Tips Membuat Breadcrumb di Blogspot

Yap, Demikian tips membuat read more otomatis blogspot, semoga bermanfaat. :)

Monggo, Berbagi Gratis, RaSah Mbayar: