pasang icon di judul artikel

Ibarat kaum hawa urusan mempercantik template blogspot tidak lepas pemberian aksesoris misalnya anting-anting, kalung atau cincin. Kalau boleh dianalogikan ke template blog, aksesoris tersebut bisa berupa pemberian gambar kecil (icon) di bagian tertentu, misalnya memasang perhiasan icon di merek judul artikel.
jika tertarik silahkan ikuti langkah-langkah berikut:

PERSIAPAN
Image yang akan dijadikan icon, baik itu penamaan, gambar,dimensi gambar sebaiknya berukuran kecil saja dimana; untuk icon gambar Judul artikel sebaiknya berdimensi tidak lebih dari 30 X 30px atau disesuaikan dengan besar kecilnya Teks Header. Selain itu usahakan background gambar untuk icon transparan agar nantinya menyatu dengan background template.
Simpan icon tersebut di hosting image yang menyediakan direct link misalnya Photobucket.com. Setelah itu simpan URL direct link icon-icon anda tersebut.

MEMASANG URL/LINK ICON
Agar icon bisa tampil pada setiap judul Artikel dan Sidebar kita harus memasukkan URL Direct link yang telah disimpan sebelumnya di Photobucket. kemudian masuk ke control panel blog Anda pilih blog yang akan di modifikasi dan tuju TATA LETAK -> EDIT HTML, dan sebelumnya jangan lupa untuk membackup/mendownload template anda. setelah itu Jangan lupa untuk memberi tanda centang pada "Expand Widget" kemudian ikuti langkah berikut:

cari kode ini <b:if cond='data:post.title'> (lebih mudah dengan menekan ctrl + F) dan secara menyeluruh kode tersebut seperti berikut:

<b:if cond='data:post.title'>
<h3 class='post-title entry-title'>
<b:if cond='data:post.link'>
<a expr:href='data:post.link'><data:post.title/></a>
<b:else/>
<b:if cond='data:post.url'>
<a expr:href='data:post.url'><data:post.title/></a>
<b:else/>
<data:post.title/>
</b:if>
</b:if>
</h3>
</b:if>

Perhatikan pada kode yang ditebalkan diatas <h3 class='post-title entry-title'> sisipkan kode dibawah ini tempat dibawah kode yang ditebalkan diatas

<img alt='NamaIconHeader' height='31' src='http:/AlamatDirectLinkImageAnda/NamaIconHeaderAnda.png' width='30'/>

keterangan Kode diatas:

• NamaIconHeader ganti dengan nama icon gambar Header Anda tanpa ekstensi (.PNG, .JPEG, .GIF dll).
• http:/AlamatDirectLinkImageAnda/NamaIconHeaderAnda.png ganti sesuai alamat direct link yang telah disimpan sebelumnya.
• heigh dan Width adalah tinggi dan lebar gambar icon Header anda dalam pixel (px) tapi penulisan .px tidak disertakan (hanya angka).
• untuk mengcopy code diatas silahkan blok teks/kode/bagian yang akan dicopy dan tekan ctrl + V
• template yang digunakan dalam proses ini adalah template Minima

Tekan Tombol PRATINJAU yang terletak dibagian kanan bawah Kotak Edit HTML untuk melihat hasil penambahan icon tersebut, Jika sudah muncul icon pada halaman pratinjau jangan lupa tekan tombol SIMPAN/SAVE hasil edit tersebut.

untuk melihat contoh penggunaan icon di Judul artikel lihat di sampel template gratis ini.

Semoga bermanfaaat dan selamat ngeblog. btw don't forget to leave comment yo.. :$ ;) :D