Mengganti Link Read More Dengan Gambar

mengganti link read more dengan gambar blogger
Sebelumnya saya telah jelaskan pada postingan terdahulu bagaimana membuat read more atau baca selengkapnya pada blogger. Jika anda ingin membacanya kembali silakan klik link ini Cara Membuat Read More Blogger, karena pada postingan tersebut ada keterkaitan dengan postingan yang akan saya sajikan kali ini. Baiklah, jika kita lihat biasanya di penghujung pemotongan artikel suatu blog dapat anda temukan link yang bertuliskan read more atau baca selengkapnya. Sebagai contoh coba anda lihat link read more pada blog saya yang ini. Pada blog tersebut ada link yang bertuliskan baca selengkapnya, tapi di sampingnya juga terdapat sebuah gambar icon read more. Saya akan jelaskan saja cara mengganti tulisan link read more dengan gambar dan untuk selanjutnya terserah anda, apakah tulisan read more benar-benar mau diganti atau hanya ditambahkan gambar icon di samping tulisan tersebut. 

Berikut penjelasan singkat untuk mengganti link read more dengan gambar atau icon pada blogger:
1. Seperti biasa Log in terlebih dahulu ke account blogger anda, kemudian pilih menu Design > Edit HTML, jangan lupa untuk centang Expand Widget Templates dan temukan kode yang ditandai di bawah ini:
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>Read More...</a>
</b:if>
2. Bagaimana? Sudah dapat? Ganti tulisan Read More... dengan kode ini:
<img border="0" src="http://urlgambarreadmorebloggeranda.com"/ >
Atau ganti tulisan yang ditandai berwarna merah di atas dengan url gambar read more anda. Anda juga dapat gunakan gambar yang telah saya sediakan berikut, silakan dipilih salah satu:

membuat read more blogger icon gambar read more blogger read more blogger dengan gambar icon tulisan link read more blogger dengan gambar
<img border="0" src="http://2.bp.blogspot.com/_MBRYgA9HoRE/TU-rvUpmHBI/AAAAAAAAAQM/OqWuQQqEPz8/s1600/readmore.gif"/ >
<img border="0" src="http://1.bp.blogspot.com/_MBRYgA9HoRE/TU-rkXHrFKI/AAAAAAAAAQA/Ow3D3v25JL4/s1600/more+button.gif"/ >
<img border="0" src="http://3.bp.blogspot.com/_MBRYgA9HoRE/TU-rmx5FmgI/AAAAAAAAAQE/6xhA9Fni9g4/s1600/readmore.png"/ >
<img border="0" src="http://3.bp.blogspot.com/_MBRYgA9HoRE/TU-uHsXhfkI/AAAAAAAAAQQ/lEUF_tOA5oM/s1600/read+more+arrow.png"/ >
3. Langkah akhir tinggal klik Save Template dan lihat hasilnya.

This work is protected by Copyscape and licensed under a Creative Commons Attribution - Non Commercial - Share Alike 3.0 Unported License. Articles cannot be reproduced without permission from the author. For any reuse or distribution, you must make clear to others the license terms of this work. The best way to do this is with a link to this web page.

Silakan tinggalkan jejak anda dengan berkomentar, Insya Allah agar saya bisa rutin mengunjungi blog anda. Jika belum paham mengenai artikel Mengganti Link Read More Dengan Gambar, tanyakanlah. Jika ada usulan atau keluhan, izinkanlah saya mengetahuinya. Tanggapi dengan komentar yang bijak dan jangan sia-siakan waktu anda dengan melakukan spam.

4 Komentar:

Dhana/戴安娜 said...

salam ssahabat
maaf telat
bagus dengan digantijadi lebih menarik yach

yusdin said...

wow perlu di coba ni,blog sobat sudah profesional,kalau tidak keberatan tolong tipsnya agar blog aku bisa lebih baik, aku tunggu saran dan komentarmu di blog

Ihsanul Huda said...

@Dhana: Ok, smoga lbih smakin mnarik, thanks to u mba..
@Yusdin: Thanks apresiasiny sobat, ok kita sama-sama blajar y..

KameraFoto said...

Info menarik sobat,..
Thanks... :)

Post a Comment