Menambahkan text-mouse-over image pada modul banner Joomla

Untuk memunculkan attribut text-mouse-over pada suatu image, menggunakan kode sebagai berikut:

<img src="boostability.gif" alt="Boostability Logo" title="Boostability Logo" />

Apabila mouse diarahkan ke gambar boostability.gif, kursor akan menampilkan pop-up text dengan tulisan “Boostability Logo”. Nah sekarang perhatikan image banner pada CMS Joomla, apabila mouse diarahkan ke image tersebut tidak muncul pop-up text. ( gambar dibawah hanya contoh saja 😀 )

Karena beberapa kali mendapati image pada website yang menggunakan cms Joomla dan yang menggunakan modul banner tidak muncul maka berikut sedikit tips yang bisa dipakai apabila memang dibutuhkan.

Hingga versi Joomla 1.5.22 (yang saya pakai saat posting ini dibuat) pada bagian menu administrator > modul banner tidak ditemukan dimana untuk memunculkan atribut text-mouse-over. Mengapa atribut ini cukup penting?, text-mouse-over biasanya digunakan untuk menerangkan sebuah image atau bisa juga digunakan untuk mengantisipasi apabila image tidak muncul pada halaman browser maka akan digantikan text ini.

Untuk menambahkan text-mouse-over pada image yang pada modul banner tersebut perlu sedikit modifikasi kode php-nya. File yang perlu di modifikasi pada modul banner adalah helper.php, file ini berada di direktori modules\mod_banners. Perhatikan baris kode php pada file tersebut tepatnya pada baris ke 84, atau cari baris kode seperti berikut ini:

$image = '<img src="'.$baseurl.'images/banners/'.$item->imageurl.'" alt="'.JText::_('Banner').'" />';

kode diatas apabila di-view source melalui browser, sbb:

<div class="banneritem"><a href="/component/banners/click/14.html" ><img src="http://localhost/images/banners/shop-ad.jpg" alt="Banner" /></a><div class="clr"></div>

Modifikasi kode php diatas menjadi seperti ini:

$image = '<img src="'.$baseurl.'images/banners/'.$item->imageurl.'" alt="'.$item->name.'" title="'.$item->name.'" />';

dan apabila di-view source melalui browser, sbb:

<div class="banneritem"><a href="/component/banners/click/14.html"><img src="http://localhost/images/banners/shop-ad.jpg" alt="joomla shop" title="joomla shop" /></a><div class="clr"></div>

Jika cara diatas sedikit merepotkan, anda bisa juga melakukan kustomisasi pada “Costum Banner Code” (yaitu melalui menu administrator: Component > Banners > Banners). Pilih banners yang akan di kustomisasi lalu klik tombol “Edit” (bisa juga langsung meng-klik nama banner-nya), pada bagian “Coustom Banner Code” isikan kode sebagai berikut:

<a href="{CLICKURL}" target="_blank">
<img src="images/banners/gambar-banner.jpg" alt="alternate-teks" title="{NAME}" />
</a>

Pastikan anda mengetahui lokasi file gambar bannernya berada lalu isi alternate teks. Silahkan dicoba..

Iklan

One thought on “Menambahkan text-mouse-over image pada modul banner Joomla

Tinggalkan Balasan

Isikan data di bawah atau klik salah satu ikon untuk log in:

Logo WordPress.com

You are commenting using your WordPress.com account. Logout / Ubah )

Gambar Twitter

You are commenting using your Twitter account. Logout / Ubah )

Foto Facebook

You are commenting using your Facebook account. Logout / Ubah )

Foto Google+

You are commenting using your Google+ account. Logout / Ubah )

Connecting to %s