Membuat Link Read More di postingan website atau kalau saya menyebutnya sebagai highlight postingan blog di home screen kita atau kerennya sih disebut jump break merupakan hal penting karena memberikan informasi secara singkat bagi pengunjung apa saja postingan terbaru kita di blog. Selain itu, hal ini akan memberikan nilai lebih ke pengunjung dengan membuat page view visitor kita meningkat ketika pengunjung mengekliknya. Keuntungan lainnya adalah dengan adanya jump break ini maka akan mempercepat proses loading karena akan memperkecil file yang di download.
Di postingan kali ini, kita akan mempelajari:
- Cara agar postingan kita dapat ditampilkan secara singkat dengan menggunakan link Read More.
- Menentukan berapa banyak teks yang ingin ditampilkan pada ringkasan singkat di home page yang kita buat.
- Menjadikan gambar yang kita postkan di blog menjadi ikon thumbnail yang dtunjukkan pada ringkasan homepage.
- Menentukan ukuran dari thumbnail tersebut.
Langsung saja ke Bagaimana Cara Menambah Read More di Bogspot.com
Langkah 1. Di blogger dashboard tampilan lama anda masuk ke menu design. Kalau Anda masih berada di dashboard versi baru sebaiknya anda pindah tampilan dengan melihat info cara mengubah tampilan dashboard versi baru ke tampilan dashboard versi lama berikut ini. Setelah masuk, pilih blog yang anda ingin ubah. Lalu,Pilih Edit HTML> Pilih download full Template > kemudian centang The Expand Widget Templates Box yang ada dihalaman Edit HTML tersebut. Full Download template tersebut sangat penting untuk mengantisipasi terjadinya kesalahan ketika edit HTML code dilakukan yang membuat template kita tidak bekerja.
Langkah 2. Temukan kode berikut ini di kolom HTML edit yang kita buka.
</head>
Langkah 3. Lalu letakkan kode berikut ini di atas code </head> dengan caramengkopi pastenya.
<script type='text/javascript'>
var thumbnail_mode = "no-float" ;summary_noimg = 430;summary_img = 340;img_thumb_height = 120;img_thumb_width = 120;</script>
<script type='text/javascript' src='http://bloggerblogwidgets.googlecode.com/files/auto_readmore_blogger.js' ></script>
Catatan penting:
summary_ noimg= 430; menunjukkan panjang dari ringkasan teksyang kita inginkan tanpa danya thumbnail gambar.
summary_img = 340; menentukan panjang dari teks yang kita inginkan dengan menyertakangambar thumbnail yang ada.
null_thumb_height = 120; menentukan tinggi thumbnail yangdiingikan.
null_thumb_width = 120; Menentukanlebar thumbnail yang ada di web home kita.
Langkah 4. Temukan dan ganti script <data:post.body/> dengancode di bawah ini:
Langkah 5. KlikTombol Save yang ada dibagian pojok kanan bawah dari edit HTML. SELESAI....<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == "static_page"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</div>
<script type='text/javascript'>
createSummaryAndThumb("summary<data:post.id/>");
</script>
<div style='clear: both;'/>
<span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url' >Read more ... </a></span>
</b:if>
</b:if>
IT' WORKS?!!
