Bagi yang belum faham cara membuat Read More di Blog, supaya tidak bingung, sebaiknya terlebih dahulu membaca artikel Membuat Read More Otomatis (Automatic Read More) yang sudah ada di blog ini.
Kali ini saya akan menjelaskan bagaimana cara mengganti Read More dengan gambar.
Langkah Pertama / First Step
• Seperti biasa masuk ke www.blogger.com.
• Pilih rancangan atau tata letak.
• Klik edit HTML.
• Sebelum melangkah ke pemasangan kode, silahkan download template anda, klik download template lengkap.
• Kemudian centang Expand widget template.
Langkah Kedua / Second Step
Gunakan Ctrl + F untuk mencari kode seperti atau yang mirip dengan kode di bawah ini :
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span>
</b:if><div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'>READ MORE - <data:post.title/></a></span>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
Ganti kode yang berwarna merah dengan kode seperti di bawah ini. Jadi seperti ini:
<b:if cond='data:blog.pageType != "item"'>
<div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'><img src='http://lh5.ggpht.com/_9b1traaMESE/SpeKqaOoi8I/AAAAAAAAAyw/7XvVW9lxqjk/read more.png'/></a></span>
</b:if><div expr:id='"summary" + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb("summary<data:post.id/>");</script>
<span class='rmlink' style='float:left'><a expr:href='data:post.url'><img src='http://lh5.ggpht.com/_9b1traaMESE/SpeKqaOoi8I/AAAAAAAAAyw/7XvVW9lxqjk/read more.png'/></a></span>
<b:if cond='data:blog.pageType == "item"'><data:post.body/></b:if>
Simpan Template.!
Ket: Kode yang berwarna merah dapat anda ganti dengan alamat url gambar anda sendiri sesuai template warna anda.
Selesai..mudah bukan? Bagi yang belum mengerti dengan apa yang saya jelaskan silahkan bertanya melalui kotak komentar di bawah ini.
blogwalkinggg....
ReplyDeleteVisit back yuaa.... :)