Membuat Jump Break/Read More Automatis+Image Thumbnailnya

Jump Break/Read more otomatis (Automatic Read more) adalah read more atau baca selengkapnya yang di setting secara otomatis sehingga anda tidak perlu membuat jump break secara manual di postingan sebab hal itu membuat repot. Jump Break ini akan mengambil ringkasan dari postingan blog kita di tambah juga akan mengambil gambar thumbnailnya. coba anda lihat halaman home http://asksalman19.blogspot.com. hasilnya kan terlihat mirip seperti di blog ini.


Langkah-langkah membuat Jump Break Otomatis
1. Login di Blogger 
2. Pada Dasboard pilih Layout 
3. Klik  Edit HTML
4. Centang / Check List dulu "expand widget templates"
5. Cari kode </head> kemudian copy - paste kode di bawah ini sebelum kode </head>.

<script type='text/javascript'>var thumbnail_mode = "no-float" ;

summary_noimg = 430;

summary_img = 340;

img_thumb_height = 100;

img_thumb_width = 120;

</script>

<script src='http://sites.google.com/site/hitsukeproject/summarypost.js' type='text/javascript'/> 

Anda juga bisa mengubah kode tersebut sesuai selera dan ukuran main template blog yang di gunakan.

summary_noimg = 430; kode ini untuk memotong / mengatur tinggi tanpa gambar

summary_img = 340; kode ini untuk memotong / mengatur tinggi dengan gambar

img_thumb_height = 100; kode ini untuk tinggi gambar thumbnailnya

img_thumb_width = 120; kode ini untuk lebar gambar thumbnailnya

6. Sekarang cari kode

<data:post.body/> , peringatan! bagi yang sudah memakai read more yg tidak otomatis, biasanya ada dua kode yang seperti itu, jadi pilih yang pertama. Jika anda sudah menemukannya copy - paste kode berikut lalu ganti dengan kode 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'> Read More </a></span>

</b:if>

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

Tulisan read more disana bisa anda ganti sesuai keinginan. 

7.  Jangan lupa SAVE  dan kemudian lihat hasilnya!!! 

Mulai sekarang anda tidak perlu repot lagi mengatur Jump Break ^_ ^
Selamat mencoba...

KHUSUS PENGUNA TEMPLATE CLASIK
Bagaimana dengan yang menggunakan read more yang lama? bagaimana cara ganti dengan read more automatis ini?

Nah kode yang read more yang lama kan seperti ini (setiap template Bisa jadi berbeda, jadi hati-hati ya!)

<div class='post-header-line-1'/>

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

<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>

Nah sobat informasi maya mudah-mudahan tutorial ini  bermanfaat.

Assalamualaikum :)

Jangan asal copy paste, baca aturanya di sini !
Post By Kang Salman
http://asksalman19.blogspot.com

Ingin mendapat penghasilan tambahan dari blog? Bergabung dan jadikan blog anda sebagai ladang uang bagi dompet anda setiap bulan. Cukup pasang banner saja! Daftar =>  Klik Disini <= klik!  untuk memanen uang $ seperti saya. Gratis!!

Dapatkan update artikel  terbaru kami langsung ke email anda.