Membuat Icon Gambar Pada Judul Posting

Bingung mau posting apa beberapa hari hanya ngubrak abrik template belum nemu yang srek, Dari pada pusing iseng_iseng posting bagaimana cara membuat icon pada judul postingan. Untuk membuat icon pada judul postingan sebenernya tidak terlalu sulit, bahkan gampang, kita hanya menambah sedikit code untuk style CSS yang ditemplate kita. Biasanya code buat judul postingan kita mengunakan code post h3 {....} mungkin ada beberapa yang beda karena setiap template bukan hanya dibuat oleh satu orang. Sebagai contoh anda bisa lihat gambar dibawah ini.

Bagaiman cara membuatnya silahkan ikuti langkah-langkah dibawah ini:

1. Siapkan gambar atau logo dalam format .gif atau .png karena kualitasnya lebih bagus kira-kira dengan ukuran (20px x 20px) atau (25px x 25px).

2. Upload gambarnya ke image hosting yang anda gunakan. Jika anda tidak punya anda dapat menggunakan fasilitas yang ada diblogger yaitu dengan cara anda membuat postingan lalu upload gambar. (simpan aja sebagai draf misal anda beri judul gambar ) kalau sudah copy alamat gambarnya. Contoh http://p.blogspot.com/gambar-anda.png

3. Login ke blogger anda, Masuk ke menu Design -> Edit HTML.  jangan lupa anda backup template anda untuk lebih amannya jika terjadi sesuatu.


4. Cari code yang kira-kira mirip seperti dibawah ini:

.post h3 {
margin:.5em 0;
padding:0px 0px 0px 10px;
font-size:140%;
font-weight:bold;
font-style:italic;
line-height:1.3em;
color:#333;

5. Setiap template mempunyai code yang berbeda-beda. Jadi yang perlu anda perhatikan adalah pada tulisan post h3.

6. Kalau sudah ketemu, tambahkan code

background:url(URL gambar) no-repeat; 

dan edit nilai padding menjadi 0px 0px 05px 30px. Sehingga hasilnya menjadi seperti ini

.post h3 {
background:url(URL gambar) no-repeat;
margin:.5em 0;
padding:0px 0px 05px 30px;
font-size:140%;
font-weight:bold;
font-style:italic;
line-height:1.3em;
color:#333;

7. Ganti URL gambar dengan alamat gambar yang telah anda buat tadi.
8. Kalau sudah, klik Save Template.

Selesai . Silahkan anda lihat hasilnya. gambar judul postingan anda pasti muncul.