Membuat read more Bergambar

View previous topic View next topic Go down

Membuat read more Bergambar

Post  Bijey syenna on Wed Jul 21, 2010 3:38 pm

Assalamu’ alaikum para maniak Kiwol Blog yang berbahagia dimanapun Anda berada. Pada kesempatan yang berbahagia ini saya akan menjelaskan tips blog singkat mengenai cara membuat Read More bergambar. Contohnya seperti di blog saya ini :


Jika pada postingan sebelumnya saya hanya memberikan tips tentang cara membuat ReadMore biasa, sekarang saya akan memeberikan tips untuk menjadikan ReadMore menjadi bergambar supaya website kita terlihat lebih menarik lagi. Kalau begitu nggak usah banyak bacot lagi langsung aja kita pelajari cara membuat ReadMore bergambar.
1. Login ke blogger.com
2. Klik Layout/Tata Letak ---> Edit HTML
3. Klik tulisan Download Template Lengkap untuk berjaga-jaga kalau ada kesalahan pengeditan HTML
4. Beri tanda centang pada kotak di sebelah tulisan “Expand Template Widget”
5. Cari kode seperti ini <p><data:post.body/></p> biar cepat klik Ctrl+F
6. Kemudian ganti kode tersebut dengan kode ini :

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'>Read More......</a>
</b:if>

Catatan :
Jika pada postingan sebelumnya tulisan Read Morenya seperti tulisan yang berwarna merah. Tetapi pada postingan ini kita akan mengganti tulisan tersebut menjadi gambar. Caranya ganti kode “Read More” yang berwarna merah dengan kode ini <IMG SRC='http://pic60.picturetrail.com/VOL1724/12312346/22573599/376383608.jpg'/> Maka hasilnya kurang lebih akan jadi seperti ni :

<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<a expr:href='data:post.url'><IMG SRC='http://pic60.picturetrail.com/VOL1724/12312346/22573599/376383608.jpg'/></a>
</b:if>

Bijey syenna
Admin

Posts : 8
Join date : 2010-07-14

View user profile http://linggau-forum.yourme.net

Back to top Go down

View previous topic View next topic Back to top

- Similar topics

 
Permissions in this forum:
You cannot reply to topics in this forum