Blogger Tutorial

Membuat Read More Dengan Icon Button Atau Gambar

14.22,12 Comments



Jika Dipostingan sebelumnya saya telah memberikan tutorial mengenai cara membuat Read dengan Tulisan, di postingan hari ini saya akan membuat tutorial membut Read More dengan Icon Button atau Gambar.

Langkahnya sederhana dan anda hanya perlu memodifikasi kode Read More anda yang masih berbentuk Tulisan.

Langsung kita mulai aja:

1. Login ke Akun Blogger anda masing-masing
2. Klik Layout atau Tata Letak, kemudian pilih edit html
3. Centang Expand Widget Template (saya anjurkan download dahulu template anda)
4. Cari kode dibawah 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>

Nah, setelah anda menemukan Kode Diatas Ganti Tulisan Read More... dengan kode dibawah ini:

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

Setelah itu Save dan lihat hasilnya, jika anda melakukannya dengan benar maka Tulisan Read More... yang sebelumnya akan berubah menjadi Icon Button ayau gambar Read More anda...

Nah, buat anda yang tidak mempunyai Icon Button atau Gambar Read More sendiri saya akan memberikan 3 pilihan Read More milik saya yang bisa anda pergunakan

Read More Hitam

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

Read More Orange

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

Read More Biru

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

Nah, kurang baik apa tuh gw haha.....Ok deh buat Sahabat DJ Note semua selamat Mencoba....




hosting indonesia

You Might Also Like

12 komentar:

  1. gan, mau tanya, kalo mau cari icon read more yang lengkap di mana ??
    trima ksih sebelumnya..

    visit
    http://variouszero.blogspot.com

    BalasHapus
  2. @ Various: OK ntar aneh Posting aja ya.. soalnya ane juga jarang nemuin Web yg ngasih Icon Read MOre doank ...

    BalasHapus
  3. @ Larasati Laura Kiehl: Gak bisa dimananya???

    BalasHapus
  4. huebat blognipun.. keep blogging..
    ngomong2 futune ayu.. niki gus opo ning??

    BalasHapus
  5. nice info gan,..

    tapi agan punya link icon gambarnya yang lebih banyak gak,,..??

    klu punya tolong kirim linknya ya gan..,

    thanks..

    BalasHapus
  6. emmmm........... kalau bisa situs tempat nyimpenya juga yach

    BalasHapus
  7. klo pke code HTML bisa gak om..?

    BalasHapus
  8. klo pakai tidak menggunakan url bisa gak om?? aku cuman punya code HTML-nya ..

    BalasHapus
  9. Berhasil mas.. thanks ya. kalo boleh saya mau izin menyebar luaskan nya di blog saya. nanti akan saya sertakan link sumbernya..!!!

    BalasHapus
  10. try to see my article for more boutoms

    http://seo-dz.blogspot.com/2012/08/comment-ajouter-read-more-blogger-et.html#.UFOuYtm4ZKd

    BalasHapus
  11. terimakasih tutorialnya sangat membantu sekali

    BalasHapus