Kamis, 23 Juli 2009

Membuat Icon Gambar Di samping judul posting

Membuat Icon Gambar Di samping judul posting Membuat Icon Gambar Di samping judul posting. Pernahkah teman-teman tips blogger semua melihat sebuah blog yang menampilkan icon gambar disamping judul posting mereka?. Nah apabila pernah dan kamu ingin mencoba membuat tampilan blog seperti itu, tips blogger akan berbagi tips tentang cara Membuat Icon Gambar Di samping judul posting. Caraya sangat sederhana. Yang pertama tentu saja kamu harus login dulu ke account blogger kamu.



-Kemudian masuk ke halaman edit template dan Cari Kode Css Berikut :

.post h3 {
margin:.5em 0;
padding:30px 0px 0px 45px;
font-size:120%;
font-style:italic;
line-height:1.3em;
color:#333;


-Cari Icon Yang kamu suka misalnya icon buku dan pena yang kemudian ambil link gambarnya, seperti contoh link gambar ini...

http://tbn1.google.com/images?q=tbn:nlmFs_SO55kJ_M:http://remas-alakbar.com/images/buku.png

(http://tbn1.google.com/images?q=tbn:nlmFs_SO55kJ_M:http://remas-alakbar.com/images/
buku.pngh).

-Ganti kode

padding:30px 0px 0px 45px;

Jadi

padding:48px 0px 0px 45px;

dan tambahkan

height:48px;
background:url (di bawah color:#333;)


Contoh pemasangannya seperti ini :

.post h3 {
margin:.5em 0;
padding:48px 0px 0px 45px;
font-size:120%;
font-weight:bold;
font-style:italic;
line-height:1.3em;
color:#333;
background:url(http://tbn1.google.com/images?q=tbn:nlmFs_SO55kJ_M:
http://remas-alakbar.com/images/buku.png) no-repeat left center;


5. Kemudian simpan dan lihat hasilnya.

Note : untuk mencari icon gambar yang kamu inginkan, kamu bisa mengunjungi Iconarchive.com.

Salam Tips Blogger.


Read this | Baca yang ini



Widget by [ Tips Blogger-Tutorial Blogger Pemula ]

6 comments:

Celetukan Segar mengatakan...

Ma'af saya belum coba!
Apakah nanti icon-nya tidak sama semua di tiap postingan, jika pakai cara di atas?

Bang arie mengatakan...

Di setiap postingan iconnya akan sama...

Fitri Nurrahmi mengatakan...

Ini dia yang lagi kucari!
Makasih triknya :)

Bang arie mengatakan...

Sama-sama fitri...sering ammpir ya.

Digital Baca mengatakan...

klo ditambahkan icon sebelum posting, memang membuat blog lebih keren :D

ninadii mengatakan...

iconnya gak muncul. gmanaa yaaa....

Posting Komentar

:)) :)] ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} ~x( :-t b-( :-L x( =))

Untuk menggunakan emotion copy paste kodenya saja, budayakan berkomentar setelah membaca ya .

Note : Harap gunakan nama anda dan jangan menggunakan keyword-keyword tertentu atau komentar anda tidak akan dipublish...