Ada Berbagai Cara Modifikasi Read More atau Baca Selengkapnya , baik Read More Default bawaan blogger atau yang dibuat secara manual, salah satunya di Saung Link ini yaitu memindahkan Read More ke sebelah kanan, bisa juga mengganti Tulisan Read More dengan kata lain atau gambar dll.
Ada berbagai alasan untuk modifikasi Read More, seperti ingin tampil beda , lebih keren sampai urusan SEO Friendly, dll. semua tergantung tujuan masing2. Saya misalnya karena posisi nya di sebelah kiri pas diatas widget Share AddThis atau Infogue, kalau mau klik Read More suka terganggu dengan munculan widget tersebut sehingga tulisan read morenya jadi terhalang. Untuk jelasnya coba aja sorot widget tersebut.. nah seperti ituiah masalahnya.
Ok sekarang langsung ke topik Berbagai Cara Modifikasi Read More atau Baca Selengkapnya , diantaranya :
A. Memindahkan tulisan Read More default Ke Kanan
B. Memindahkan Tulisan Read More bukan default ke kanan
C. Merubah Tulisan Read More dengan kalimat sendiri
D. Mengganti Tulisan Read More dengan gambar atau icon
A. Memindahkan tulisan Read More default Ke Kanan
Maksud bukan default disini adalah read more yang kita buat secara manual seperti yang ada dalam postingan ini. Untuk memindahkan posisi Read More ke sebelah kanan yang saya lakukan di Blog ini adalah sbb.
<a expr:href='data:post.url'>Read More.. <data:post.title/></a> </span>
C. Merubah Tulisan Read More dengan kalimat sendiri
Ini sih paling gampang tinggal ganti saja tulisan Read More dengan kata-kata sendiri sesuai selera, misalnya : Baca selengkapnya.. , lanjutkan.., dsb.
D. Mengganti Tulisan Read More dengan Gambar atau Icon
<img src=' URL gambar Read More yang telah di upload '/>
Sampai disini aja.. Blog Tutorial dalam topik Berbagai Cara Modifikasi Read More , sengaja saya tampilkan beberapa kode yang berbeda, siapa tahu ada yang sama. Semoga bermanfaat.
Ada berbagai alasan untuk modifikasi Read More, seperti ingin tampil beda , lebih keren sampai urusan SEO Friendly, dll. semua tergantung tujuan masing2. Saya misalnya karena posisi nya di sebelah kiri pas diatas widget Share AddThis atau Infogue, kalau mau klik Read More suka terganggu dengan munculan widget tersebut sehingga tulisan read morenya jadi terhalang. Untuk jelasnya coba aja sorot widget tersebut.. nah seperti ituiah masalahnya.
Ok sekarang langsung ke topik Berbagai Cara Modifikasi Read More atau Baca Selengkapnya , diantaranya :
A. Memindahkan tulisan Read More default Ke Kanan
B. Memindahkan Tulisan Read More bukan default ke kanan
C. Merubah Tulisan Read More dengan kalimat sendiri
D. Mengganti Tulisan Read More dengan gambar atau icon
A. Memindahkan tulisan Read More default Ke Kanan
- Login ke blogger.com – > Pilih Template – > Edit HTML
- Backup dulu templatenya ya,, untuk berjaga-jaga
- Centang Expand Template Widget
- Cari kode seperti ini : Selalu gunakan Ctrl+F agar mudah mencarinya
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'>'Read More'/></a>
</b:if> - Tambahkan kode warna merah diposisi berikut ini
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<div style='float:right;padding:10px 0px 5px 0px'> <a expr:href='data:post.url + "#more"' expr:title='data:post.title'>'Read More'/></a>
</div> </div> </b:if> - Selesai , lakukan preview dulu, kemudian simpan template
Maksud bukan default disini adalah read more yang kita buat secara manual seperti yang ada dalam postingan ini. Untuk memindahkan posisi Read More ke sebelah kanan yang saya lakukan di Blog ini adalah sbb.
- Langkah 1 sampai 3 lihat diatas
- Kode Pada blog ini saya dapatkan sbb. :
<data:post.body/>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'> Read More...</a>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
- Kemudian saya tambah kode warna merah, hingga akhirnya seperti ini :
<data:post.body/>
<b:if cond='data:blog.pageType != "item"'>
<span class='rmlink' style='float:right'>
<a expr:href='data:post.url'> Read More...</a> </span>
</b:if>
<div style='clear: both;'/> <!-- clear for photos floats -->
</div>
- Atau tinggal ganti left menjadi right kalau menemukan kode sudah seperti berikut ini :
<a expr:href='data:post.url'>Read More.. <data:post.title/></a> </span>
C. Merubah Tulisan Read More dengan kalimat sendiri
Ini sih paling gampang tinggal ganti saja tulisan Read More dengan kata-kata sendiri sesuai selera, misalnya : Baca selengkapnya.. , lanjutkan.., dsb.
D. Mengganti Tulisan Read More dengan Gambar atau Icon
- Perhatikan kalau menemukan kode seperti dibawah ini :
<data:post.body/>2. Sebelum menggantinya tentu harus punya dulu sumber / Url gambarnya , buatlah logo misalnya dengan Software Cooltext . Kemudian ganti kode warna merah diatas dengan kode berikut :
<b:if cond='data:blog.pageType != "item"'>
<span class='rmlink' style='float:right'>
<a expr:href='data:post.url'> Read More...</a> </span>
</b:if>
Ayau ada juga kode yang seperti ini :
<b:if cond='data:post.hasJumpLink'>
<div class='jump-link'>
<a expr:href='data:post.url + "#more"' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
</b:if>
<img src=' URL gambar Read More yang telah di upload '/>
Sampai disini aja.. Blog Tutorial dalam topik Berbagai Cara Modifikasi Read More , sengaja saya tampilkan beberapa kode yang berbeda, siapa tahu ada yang sama. Semoga bermanfaat.
0 komentar :
Posting Komentar