Masih Seputar Image. Mungkin postingan yang akan Tips dan Trik Blog ketengahkan ini sudah sering dibahas oleh teman-teman blogger lain. Dan bagi yang sudah mahir, postingan ini mungkin tidak akan ada manfaatnya. Namun bagi new blogger mungkin masih membutuhkannya dan siapa tahu ada manfaatnya. Jika pun tidak ada manfaatnya, anggaplah hal ini “sampah internet” yang tidak perlu kita pedulikan.

Postingan kali ini akan membicarakan seputar membuat unclickable image (tidak bisa diklik), membuat clickable image (dapat diklik), dan membuat image terbuka pada jendela baru (new window) ketika image tersebut diklik oleh pengunjung. Kita dapat menempatkan image tersebut baik pada postingan maupun pada side bar blog.

Sebelum melakukan hal itu, kita harus mengupload image yang ingin kita tampilkan tersebut pada image hosting. Banyak image hosting yang tersedia di internet baik yang bersifat gratisan maupun yang berbayar. Jika ingin yang gratisan, kita dapat mencoba salah satunya, yaitu photobucket.com.

Setelah kita menguploadnya, maka kita akan mendapatkan kode html untuk image tersebut. Contohnya seperti di bawah ini.

Untuk menampilkan image pada blog formatnya masing-masing seperti di bawah ini.

Membuat unclickable image, formatnya seperti di bawah ini.

<img src="http://i209.photobucket.com/albums/bb287/yono_pati/hp.jpg“/>

Hasilnya seperti di bawah ini. Image ini tidak bisa diklik, silakan untuk diklik sendiri.

Membuat clickable image, formatnya seperti di bawah ini.

<a href="http://i209.photobucket.com/albums/bb287/yono_pati/hp.jpg“>
<img src="http://i209.photobucket.com/albums/bb287/yono_pati/hp.jpg“/>

Hasilnya seperti di bawah ini.


Ketika image ini diklik oleh pengunjung maka pengunjung akan dibawa menuju link dari image tersebut. Dan dengan format seperti ini pula, image akan ditampilkan pada jendela yang sama dan oleh karena itu akan menindih halaman yang kita buka sebelumnya.

Jika menginginkan, kita dapat mengganti link image tersebut menjadi link yang lain, seperti alamat blog atau situs milik kita atau pun milik orang lain. Formatnya menjadi seperti di bawah ini.

<a href="http://onoid.blogspot.com“><img src="http://i209.photobucket.com/albums/bb287/yono_pati/mychicklet.gif“/>

Catatan

Silakan ganti URL_Blog yang berwarna biru dengan URL_Blog yang dikehendaki.

Membuat Image Terbuka Pada Jendela Baru (New Window), formatnya seperti di bawah ini.

<a href="http://i209.photobucket.com/albums/bb287/yono_pati/hp.jpgtarget=”_blank“>
<img src="http://i209.photobucket.com/albums/bb287/yono_pati/hp.jpg“/>

Dengan format seperti di atas maka ketika suatu image diklik maka pengunjung akan dibawa menuju jendela baru. Dengan demikian blog kita akan terlihat lebih professional karena image akan ditampilkan pada jendela baru dan tidak menindih jendela yang lama.
Hasilnya seperti di bawah ini, dan untuk melihat perbedaannya, silakan klik pada image di bawah ini.


Semoga bermanfaat!!!