MEMBUAT READ MORE DENGAN ICON BUTTON ATAU GAMBAR

·

Posted by Mochamad Robby Wijaya

Jika dipostingan saya sebelumnya pernah membahas Cara Membuat Read More pada Blog kali ini saya akan membahas tentang cara Membuat Read More dengan Icon Button atau Gambar sebenarnya cara pembuatannya hampir sama dengan Cara membuat Read More pada Blog tetapi ada sedikit penambahan Javascript.

Dimana dengan membuat read more dengan icon button atau gambar blog kita akan terasa lebih menarik dan juga akan terlihat indah,karena dengan keindahan pastinya para pembaca artikel ingin lebih berlama lama di blog kita dikarenakan keindahan blog kita.

Baiklah langsung saja kita mulai pembuatan read more dengan icon atau gambar :


1. Masuk pada akun blogger sobat.

2. Klik Rancangan kemudian pilih edit Html

3. Centang Expand Widget Template ( saya anjurkan untuk download template sobat dulu,khususnya yang masih pemula/newbie )

4.  Setelah itu cari kode seperti dibawah ini jika sobat sudah pernah membuat Read More,jika belum pernah membuat anda baca artikel tentang Cara membuat Read More :

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<div expr:id='&quot;summary&quot; + data:post.id'><data:post.body/></div>
<script type='text/javascript'>createSummaryAndThumb(&quot;summary<data:post.id/>&quot;);
</script>
<span class='rmlink' style='float:right;padding-top:20px;'>
<a expr:href='data:post.url'>&#187;&#187;&#160;&#160;Read More...!!!</a></span>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'><data:post.body/></b:if>

5. Nah,setelah sobat menemukan kode seperti diatas ganti tulisan &#187;&#187;&#160;&#160;Read More...!!! dengan kode dibawah ini :


<img border="0" src="Paste alamat hostingan gambar Read More Anda"/>

6. Setelah itu save dan lihat hasilnya,jka sobat melakukannya dengan benar maka tulisan read more yang sebelumnya akan berubah menjadi icon button atau gambar read more sobat.

nah,jika sobat tidak mempunyai icon button atau gambar read more sendiri,saya akan 3 pilihan read more yang dapat sobat gunakan :

Dan ini alamatnya :
http://i785.photobucket.com/albums/yy131/djnand/Button_ReadMore_Reflective.jpg

 Dan ini alamatnya :
   http://i785.photobucket.com/albums/yy131/djnand/readMorehitam.png

    Dan ini alamatnya :
    http://i785.photobucket.com/albums/yy131/djnand/but_moreinfoorange.gif


Selamat mencoba sobat dan sukses selalu

0 komentar:

Posting Komentar

Alexa Page Rank

Pengunjung Blog

free counters

Daftar Isi

Loading...

Total Tayangan Halaman

Kategori Artikel

Followers

Robbyshared Followers

FACEBOOK FANS PAGE

d-Mevers