Pages

Ads 468x60px

Jumat, 23 Oktober 2009

Merubah Read More tampil lebih cantik

Read More (Baca lengkap dll) yang sering muncul dihalaman blog sering kali hanya berupa teks yang tampil tanpa 'embel-embel' (tampil berupa teks doang!), sehingga meskipun hanya secuil informasi, terkesan tidak diberi kesempatan untuk membuat blog semakin menarik. Ada satu cara simple untuk merubah tampilan read more ini tanpa harus menambah gambar atau animasi yang akan semakin membebani blog. Sekelumit kode tambahan akan membuatnya tampil semakin bersahabat bagi pengelana blog.

Sebelum memulai "mendadani" read more, perlu sedikit diingat lagi bahwa teks tersebut diletakkan diantara kode seperti ini:

<a expr:href='data:post.url'>Read More</a>

1. Untuk mencari sekaligus "mendadani" kode yang dimaksud di atas, seperti biasa lakukan :
Login Blogger --> Tata Letak --> Edit HTML --> Download Template Lengkap -->

simpan di folder PC

2. Setelah pengamanan template selesai tetaplah di Edit HTML kemudian beri tanda "centrang" pada Expand Template Widget dengan meng"KLIK" kotak kecil disampingnya.

3. Cari KODE yang ada Read More-nya tersebut dan tambahkan KODE di bawah untuk menggantikan teks Read More yang sudah ada di template, sehingga bentuk KODE menjadi seperti ini :

<table style="float:left; width:100px;" bgcolor="#000000" border="1" bordercolor="blue" height="20"><tr><td style="background: #444343; text-align:center; border:1px solid yellow; font:bolder 14px Times New Roman; "> Read More ! </td></tr></table>

4. Setelah KODE terpasang, KLIK Simpan Template. Lihat hasilnya di blog !

Keterangan :
- Gunakan Ctrl+F untuk mempermudah pada saatmencari KODE di ruang Edit HTML.
- Apabila read more ingin diletakkan di sisi kanan, ganti float:leff dengan float:right.
- Besaran bingkai dan warna border, teks serta background bisa anda rubah sendiri sesuai dengan warna blog !!

0 komentar:

Posting Komentar