Tips/Trik Menampilkan Gambar Icon di Samping Judul Posting

Halow sobat bloggers, ketemu lagi di blog kesayangan ane nie...(lebay mode : ON)
Pada kesempatan kali ini ane pengen share  Tips/Trik Menampilkan Gambar Icon di Samping Judul Posting.
Memang meletakkan script atau bahasa html pada template blogger (halaman edit html dengan contreng exspand widget templates) yang biasa kita lakukan, tidak akan bekerja jika terjadi kesalahan meskipun hanya kesalahan kecil dalam menuliskan kurang sebuah tanda petik, garis miring sebagai penutup dalam html, dan lain sebagainya.

Oleh karenanya, yang akan kita tempatkan pada halaman tersebut harus benar-benar fix tanpa ada kesalahan, biasanya yang sering terjadi adalah kesalahan pada tanda petik.
Berikut ini sob adalah tutorial cara menambahkan icon gambar sebelum entri posting pada blogger. Insya Allah, cara ini bisa 100% bekerja dengan baik.

Cara Memasang Icon Gambar Sebelum Entri / Judul Posting 


Langkah pertama yg harus sobat bloggers lakukan adalah mencari sebuah gambar/icon yg akan dipasang.Setelah bahan sudah ada, ente tinggal upload ke hosting ente ,atau bisa ke blog ente sendiri, setelah itu copy alamat URL gambar yg sobat bloggers punya.

Contoh, alamat URL gambar yang ane punya:

http://profile.ak.fbcdn.net/hprofile-ak-snc4/174827_324775874263127_408317016_q.jpg

Rubahlah menjadi seperti ini :

<img src='http://profile.ak.fbcdn.net/hprofile-ak-snc4/174827_324775874263127_408317016_q.jpg'></img>

Warna hijau, ganti dengan alamat URL gambar yang telah ente siapkan tadi.

Simpan di Notepad dulu, jangan disimpan dan jangan pula di hapus, (aaaaalah!)
Setelah itu, pergilah ke Dashboard Blog ente, lalu pilih Tata Letak, selanjutnya pilih tab Edit HTML
Contreng Expand Widget Templates, lalu cari kode berikut :
<a expr:href='data:post.url'><data:post.title/></a>

Untuk mempermudah pencarian,Tekan Ctrl+F pada keyboard,dan tuliskan kode tersebut,nantinya kode akan terdeteksi secara otomatis!
Setelah ketemu,sisipkan alamat URL gambar ente(yang sudah entesimpan di notepad tadi),di antara kode tersebut.
Setelah kode URL alamat gambar ente disisipkan,akan menjadi seperti ini :

<a expr:href='data:post.url'><imgsrc='http://profile.ak.fbcdn.net/hprofile-ak-snc4/174827_324775874263127_408317016_q.jpg'></img>
<data:post.title/></a>

Jadi, dech...Hasilnya akan tampak seperti berikut :


Semoga bermanfaat ya buat sobat bloggers semuanya :D 



Share:

0 comments