Menambahkan Image Pada Judul Posting

Jika berbicara image (gambar) tentunya ada dua hal yang langsung terpikirkan oleh blogger. Pertama, blog semakin menarik dan yang kedua loading blog semakin berat. Walaupun demikian, saya tetap posting cara menambahkan image pada judul posting berikut ini. Barangkali ada yang tertarik . Kalau image sudah dipasang, nantinya akan muncul gambar di samping setiap judul posting secara otomatis.

Cara menambahkan image pada judul posting

Langkah Pertama
Yang pasti, anda siapkan dulu gambar (image) yang menarik tentunya. Kemudian upload ke tempat hosting gambar. Catat URL alamat penyimpanan gambar untuk digunakan nantinya. Misalnya saya siapkan gambar seperti ini :

Dengan URL alamat gambar adalah ini :
http://i36.tinypic.com/xqce93.jpg

Untuk memanggil image, kita harus mengatur kode pemanggilan menjadi seperti ini :

<img src="http://i36.tinypic.com/xqce93.jpg" width="45" hight="45" border="0"></img>

Sedikit keterangan, width="45" hight="45" border="0 secara berurutan adalah lebar, tinggi dan tebal garis batas gambar yang nantinya terlihat di samping judul posting. Border nilai "0" mengartikan image tidak akan berborder. Oke, nampaknya tidak begitu sulit bukan.

Langkah Kedua

1. Login ke blogger dengan id anda


2. tuju bagian Tata Letak


3. pada tab menu klik Edit HTML


4. Silahkan backup dulu template dengan mengklik kotak kecil Expand Template Widget jika dirasa perlu.


5. Cari kode berikut :
   

   <a expr:href='data:post.url'>
   <data:post.title/></a>
   <b:else/>



6. Sisipkan kode pemanggilan untuk image diantara kode CSS template yang <a expr:href='data:post.url'> dan <data:post.title/></a>
   Sehingga secara lengkap menjadi seperti ini :
   

   <a expr:href='data:post.url'>
   <img src="http://i36.tinypic.com/xqce93.jpg" width="45" hight="45" border="0"></img>
   <data:post.title/></a>
   <b:else/>



7. Klik tombol Pratinjau untuk melihat hasil sementara.


8. Jika sudah cocok, klik tombol SIMPAN TEMPLATE


9. Selesai

Dengan menggunakan alamat gambar saya di atas, maka hasilnya akan menjadi seperti ini :



Selamat mencoba dan semoga tampilan judul posting blog anda semakin menarik. Semoga bermanfaat.

Related Post:

Trik Blogspot

• Mengganti Pager Link Blogger Dengan Icon
• Klik Label Tampil Hanya Judul Posting Update
• Klik Label Tampil Hanya Judul Posting
• Menambahkan Icon Pada Label Dan Link Sidebar
• Mengganti Tanggal Dengan Icon Kalender
• Menghilangkan Icon QuickEdit (Tang dan Obeng)
• Area Sidebar Dalam Kotak Terpisah
• Area Komentar Dalam Kotak Terpisah
• Area Posting Dalam Kotak Terpisah
• Background Warna Pada Teks Posting
• Modifikasi Pesan Pengantar Formulir Komentar
• Beda Tampilan Komentar Pemilik Blog
• Nomor Urut Komentar (Numbering Comment) Blogger
• Pasang Emoticon Di Atas Kotak Komentar
• Membuat Blockquote Dan Modifikasi Blockquote
• Masalah Pada Verifikasi Kotak Komentar
• Membuat Teks Berkedip Blink Text
• Membuat Horizontal Navigasi Blogger
• Avatar Profil Komentar Blogger Update
• Latar Belakang Teks Dengan Efek Stabilo
• Menggunakan Gambar Untuk Latar Belakang Blog
• Pasang Strip-Ad Seperti Navbar Blogger
• Menghilangkan Border Pada Image Posting
• Modifikasi Border Photo Profil Blogger

or or