English French German Spain Italian Dutch Russian Portuguese Japanese Korean Arabic Chinese Simplified

Jumat, 10 Juni 2011

Cara Membuat "Baca Selengkapnya..." di Blogger

Berikut adalah langkah-langkah untuk membuat tombol "selengkapnya atau read more" pada postingan yang panjang :

1. Buka menu Layout kemudian pilih Edit HTML.

2. Kasih tanda cek (centang) pada cekbox "expand widget template"
3. Cari kode berikut di Template blog anda  :
(caranya : tekan ctrl+F dan akan muncul menu Find, kemudian masukkan kode yang akan anda cari)


<div class='post-body entry-content'>

<p><data:post.body/></p>



4. Kalau sudah ketemu, Ganti kode tersebut menjadi seperti ini :


<div class='post-body entry-content'>
<b:if cond='data:blog.pageType == "item"'>
<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'>Read More......</a>
</b:if>


Tulisan "Read More....." itu bisa anda ubah, misalnya jadi "Baca Selengkapnya...", atau lainnya.

5. Simpan hasil pengeditan.
6. Kemudian pilih menu
Setting lalu pilih Formatting
7. Pada kotak Post Template isikan kode berikut:

<span class="fullpost">


</span>


8. Kemudian Simpan.
9. Ketika memposting, klik EDIT HTML. Maka, secara otomatis akan tampak kode seperti berikut :

<span class="fullpost">


</span>


10. Letakkan abstrak posting atau artikel yang akan ditampilkan dihalama utama (sebelum tulisan "Redmore...") di atas kode ini :

<span class="fullpost
">

sementara sisanya yaitu keseluruhan posting letakkan di antara kode :

<span class="fullpost">

dan

</span>

11. Selesai
Selamat Mencoba...


cara lain

Buat kalian yg ingin membuat read more otomatis , silahkan ikuti cara dibawah ya...

1 . Pada dasbor blog >> rancangan >> edit HTML >> centang expand widget template

2 . Cari kode </head>

3 . Kemudian kalian copy kode dibawah ini tepat dibawah kode diatas

<script type='text/javascript'> var thumbnail_mode = &quot;no-float&quot; ; summary_noimg = 430; summary_img = 340; img_thumb_height = 100; img_thumb_width = 120; </script> <script src='http://rizqi.moehamed.googlepages.com/read-moreotomatis.js' type='text/javascript'/>

4 . Kemudian cari lagi kode <data:post.body/>

5 . Lalu ganti kode diatas dengan kode dibawah ini

<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='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'>&#187;&#187;&#160;&#160;Lanjutin Yuk...</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

Tulisan yg tebal bisa diganti dengan kata-kata kalian sendiri

6 . Klik simpan
 
 

0 komentar:

Posting Komentar

Berikan Kritik dan Saran Anda