New >>>

Sabtu, 24 September 2011

Merubah Read More Dengan Icon Image

lintasberita Bookmark and Share


sebenarnya sudah lama saya ingin memposting bagaimana cara merubah readmore dengan icon image,tapi yah biasa lah seorang pelajar yang sibuk sana-sini dengan tugas sekolahnya..hehe (ngeles)
oke sob,kita langsung saja. Mungkin bagi para blogger mania readmore adalah perangkat yang sangat dibutuhkan,karena mereka dapat memotong bagian teks di halaman awal agar tidak memakan banyak tempat. Tapi tentunya tak sedikit dari sobat blogger yang merasa jenuh karena readmore yang digunakan hanya berupa teks readmore atau selengkapnya, sehingga ingin menggantinya dengan sebuah icon seperti ini atau

Tenang sob,itu adalah hal yang cukup mudah kok. Yang pertama harus disiapkan tentu adalah sebuah icon image, kemudian uploadlah image tersebut ke situs tempat penyimpanan image seperti photobucket. Setelah proses upload selesai, copylah URL image tersebut, seperti contoh dibawah ini :


http://i1176.photobucket.com/albums/x331/dani_dan28/15-large-allblogtools.png

Sehingga icon yang akan muncul adalah seperti ini


tentu kreasi imagenya anda bisa sesuaikan dengan selera anda (ini hanya contoh). Namun jika anda malas untuk mengupload,di bawah sudah saya siapkan beberapa icon yang mungkin cocok untuk anda.

Untuk mengganti icon tersebut,silahkan ikuti langkah di bawah ini :

  • Seperti biasa anda harus dalam keadaan sign in pada blogger
  • Masuk ke menu Tata Letak/Layout
  • Klik Edit HTML lalu centang kotak kecil di samping Expand Template Widget

  • Untuk menjaga 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 yang telah di sediakan di atas,sehingga menjadi sepert ini :

<p><data:post.body/></p>
<a expr:href='data:post.url'><strong><img src="http://i1176.photobucket.com/albums/x331/dani_dan28/15-large-allblogtools.png"/></strong></a>
</b:if>


  • Terakhir,save template anda dan lihat hasilnya !


Berikut adalah beberapa icon yang sudah saya sediakan





http://i1176.photobucket.com/albums/x331/dani_dan28/30-large-allblogtools.gif






http://i1176.photobucket.com/albums/x331/dani_dan28/black.png






http://i1176.photobucket.com/albums/x331/dani_dan28/red.gif






http://i1176.photobucket.com/albums/x331/dani_dan28/dark-grey.gif

jika icon di atas masih kurang,silahkan anda download di sini,di sini dan di sini. Dijamin icon-nya keren-keren deh ..
Semoga bermanfaat ..

0 komentar:

Posting Komentar