Selasa, 17 Juli 2012

Cara Merubah Read More dengan Icon Image

Cara merubah atau mengganti tulisan Read More dengan image agar lebih menarik. Yang pertama harus disiapkan tentu adalah sebuah icon/image seperti ini:




kemudian upload-lah image tersebut ke situs tempat penyimpanan image seperti Photobucket. Setelah proses upload selesai, copy URL image tersebut, seperti contoh dibawah ini:

http://i1068.photobucket.com/albums/u456/rizkydork/Readmore-2.jpg

Tambahkan kode (warna merah) agar image tersebut dapat ditampilakn seoperti dibawah ini :
<img src="http://i1068.photobucket.com/albums/u456/rizkydork/Readmore-2.jpg"/>

Selanjutnya ikuti tutorial berikut:
1. Seperti biasa anda harus dalam keadaan sig ini pada blogger
2. Masuk menu Tata Letak/ Layout-klik Edit HTML-Centang kotak kecil disamping Expand Template Widget
3. Untuk menjaga yang tidak anda inginkan bisa Back up terlebih dahulu template anda!Kemudian cari kode seperti ini:

<p><data:post.body/></p>
<a expr:href='data:post.url'><strong>Read More...</strong></a>
</b:if>

Gantilah kalimat Read More dengan URL image yang telah kamu disiapkan diatas, sehingga menjadi seperti ini :

<p><data:post.body/></p>
<a expr:href='data:post.url'><strong><img src="http://i1068.photobucket.com/albums/u456/rizkydork/Readmore-2.jpg"/></strong></a>
</b:if>

4. Terakhir, save template dan lihat hasilnya
5. Selamat mencoba :)

Tidak ada komentar:

Posting Komentar