15 Januari 2012

Cara Menambahkan Icon Di Judul Postingan

Cara Menambahkan Icon Di Judul Postingan - Menambahkan Icon pada setiap judul postingan semakin menambah indahnya postingan dan Blog kita. Icon gambar ini terletak di Depan judul postingan, maaf kalo saya gak buat screenshootnya coz koneksi lagi lemot dan buru buru update postingan nih. Ok deh dari pada berlama lama ngelantur gak karuan mending langsung Lihat Cara Menambahkan Icon Di Judul Postingan :

Ikuti Tutorial Cara Menambahkan Icon Di Judul Postingan berikut :
Login ke Blogger - Pilij Rancangan - Edit Html- kemudian cari kode yang mirip seperti ini :
(jangan lupa back up template anda terlebih dahulu)

.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:$titlecolor;
}

ingat : tidak semua kode template menggunakan Tag h3. mungkin aja pake h1 atau h2.

Jika sudah ketemu , letakkan kode berikut sebelum kode kurung kurawal   }


background:url(http://gambaranda.Jpg)no-repeat left;

Sehingga susunan kodenya akan menjadi seperti berikut :

.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:$titlecolor;
background:url(http://gambaranda.Jpg)no-repeat left;
}

Kemudian Atur jarak antara Judul dengan Icon agar tampak pas dengan cara mengubah nilai padding.
padding:0 0 4px; menjadi :

padding:0 0 4px 50px;
  • Yang berwarna merah adalah padding atas.
  • Yang berwarna biru adalah padding kanan.
  • Yang berwarna ungu adalah padding bawah.
  • Yang berwarna hijau adalah padding kiri.
Langkah terakhir adalah Simpan Template. Semoga Cara Menambahkan Icon Di Setiap Judul Postingan bermanfaat.

2 komentar: