Membuat Yahoo Online Status Indicator

Alternatif untuk selalu kontak dengan pengunjung blog kita dapat kita lakukan dengan beberapa cara, diantaranya dengan pemasangan shoutbox, Yahoo! Messenger Pingbox dan lain-lain. Namun disini saya ingin berbagi pengetahuan bagaimana menambahkan Yahoo Online Status Indicator dan Contac me @ Yahoo messenger.

1. Yahoo Online Status Indicator.

Saya rasa untuk Yahoo Online Status Indicator ini sudah banyak yang tahu, mengingat banyak situs yang menyediakan layanan gratis untuk menambahkan indicator ini, namun bagi mereka yang kurang puas dengan image yang telah disediakan atau ingin menambahkan image dari hasil kreasi mereka tentu ingin sekali mengetahui bagaimana cara menampilkan hasil kreasi kita pada Yahoo Online Status Indicator di Sidebar blog kita.

Dengan memanfaatkan layanan gratis dari http://www.onlinestatus.org, maka kita dapat membuat "Yahoo Online Status Indicator" dengan hasil kreasi kita. Langkah awal tentunya kita harus menyiapkan Icon "Yahoo Online Status Indicator" sebanyak 3 (tiga) icon yaitu : Icon status Online, Icon status Offline dan Icon status Unknown. Buatlah tiga icon "Yahoo Online Status Indicator" dengan menggunakan Adobe Photoshop dengan ukuran sesuai selera anda, namun saya menyarankan membuat icon "Yahoo Online Status Indicator" berukuran 128 X 128 pixel.

Dibawah ini contoh ketiga icon "Yahoo Online Status Indicator"



Setelah kita membuat icon "Yahoo Online Status Indicator", segera login di Blogger kemudian klik Entri baru (posting) dan upload ketiga icon "Yahoo Online Status Indicator". Coba perhatikan hasil upload icon "Yahoo Online Status Indicator" pada posting di Edit HTML sbb :

Contoh kode Icon Offline icon "Yahoo Online Status Indicator"

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://2.bp.blogspot.com/_gB_64c8osAk/St_6ikc6fJI/AAAAAAAAAM0/nl9iX7ZDLtg/s1600-h/offline-YM.png"><img style="cursor: pointer; width: 128px; height: 128px;" src="http://2.bp.blogspot.com/_gB_64c8osAk/St_6ikc6fJI/AAAAAAAAAM0/nl9iX7ZDLtg/s320/offline-YM.png" alt="" id="BLOGGER_PHOTO_ID_5395306350420589714" border="0" /></a>

Nah tugas anda disini hanya menyalin kode yang tercantum dibawah ini pada notepad.

http://2.bp.blogspot.com/_gB_64c8osAk/St_6ikc6fJI/AAAAAAAAAM0/nl9iX7ZDLtg/s320/offline-YM.png

Kerjakan langkah ini pada icon "Yahoo Online Status Indicator" yang lain. Setelah tersalin pada notepad, anda tidak perlu klik "Terbitkan Entri" namun cukup klik "Simpan Sekarang" agar ketiga icon "Yahoo Online Status Indicator" tidak muncul pada halaman posting blog anda.

Setelah itu silahkan berkunjung di situs http://osi.techno-st.net:8000/, Pada Item Mesengger silahkan pilih Yahoo, kemudian pada User Id : isi Id YM anda, Pada Address to Online Icon : isi dengan url image Online, Address to Offline icon : isi dengan url icon Offline, Address to unkown icon : isi url icon unkown, untuk IRC Channel : ( disini saya kosongkan ).
Setelah itu klik tombol Get HTML maka anda akan mendapatkan kode seperti ini :
Contoh kode HTML saya :

HTML code to put on your web page:

<!-- Begin Online Status Indicator code -->
<!-- http://www.onlinestatus.org/ -->
<A HREF="ymsgr:sendIM?nataludin5">
<IMG SRC="http://osi.techno-st.net:8000/yahoo/nataludin5/onurl=2.bp.blogspot.com/_gB_64c8osAk/St_6iA6gxDI/AAAAAAAAAMk/gbd4LRWvJAM/s320/Ymonlikoe.png/offurl=2.bp.blogspot.com/_gB_64c8osAk/St_6ikc6fJI/AAAAAAAAAM0/nl9iX7ZDLtg/s320/offline-YM.png/unknownurl=3.bp.blogspot.com/_gB_64c8osAk/St_6icYgK_I/AAAAAAAAAMs/tn8k_J6PX-c/s320/unknown.png"
align="absmiddle" border="0" ALT="Yahoo Online Status Indicator"
onerror="this.onerror=null;this.src='http://3.bp.blogspot.com/_gB_64c8osAk/St_6icYgK_I/AAAAAAAAAMs/tn8k_J6PX-c/s320/unknown.png';"></A>
<!-- End Online Status Indicator code -->

Forum code to put in your signature in a discussion forum:

[URL=http://osi.techno-st.net:8000/message/yahoo/nataludin5][IMG]http://osi.techno-st.net:8000/yahoo/nataludin5/onurl=2.bp.blogspot.com/_gB_64c8osAk/St_6iA6gxDI/AAAAAAAAAMk/gbd4LRWvJAM/s320/Ymonlikoe.png/offurl=2.bp.blogspot.com/_gB_64c8osAk/St_6ikc6fJI/AAAAAAAAAM0/nl9iX7ZDLtg/s320/offline-YM.png/unknownurl=3.bp.blogspot.com/_gB_64c8osAk/St_6icYgK_I/AAAAAAAAAMs/tn8k_J6PX-c/s320/unknown.png[/IMG][/URL]

Alternate forum code if the above doesn't work:

[URL="http://osi.techno-st.net:8000/message/yahoo/nataludin5"][IMG]http://osi.techno-st.net:8000/yahoo/nataludin5/onurl=2.bp.blogspot.com/_gB_64c8osAk/St_6iA6gxDI/AAAAAAAAAMk/gbd4LRWvJAM/s320/Ymonlikoe.png/offurl=2.bp.blogspot.com/_gB_64c8osAk/St_6ikc6fJI/AAAAAAAAAM0/nl9iX7ZDLtg/s320/offline-YM.png/unknownurl=3.bp.blogspot.com/_gB_64c8osAk/St_6icYgK_I/AAAAAAAAAMs/tn8k_J6PX-c/s320/unknown.png[/IMG][/URL]

Silahkan copas pada notepad:

Salin kode "HTML code to put on your web page" kemudian pada Tata Letak blogger anda klik "tambah gadget" pilih HTML/Javascript dan masukkan kode tersebut. Silahkan cek hasil dari icon "Yahoo Online Status Indicator" , yaitu dengan cara anda aktifkan YM atau email anda yang terkait dengan ID YM anda. Maka secara auto icon akan menyesuaikan status anda.

2. Contac me @ Yahoo messenger.

Untuk membuat Icon Contac me @ Yahoo messenger, langkahnya sama hanya anda tidak perlu berkunjung ke situs http://osi.techno-st.net:8000/, cukup dengan upload gambar anda pada blogger (Ukuran gambar yang saya buat ukuran 125 X 125 px, lihat contoh dibawah),




copas kodenya kemudian modifikasi kode HTML seperti ini :

<div class='widget-content'>
<a href="ymsgr:sendIM?ID Yahoo Messenger Anda" title="Contact Me @ Yahoo Messenger"><img src="http://3.bp.blogspot.com/_gB_64c8osAk/SuACqP8UQ0I/AAAAAAAAAM8/_6kY67jeeEE/s320/contact-me.png"/></a>
</div>

Silahkan masukkan Id YM anda pada "ID Yahoo Messengger anda" kemudian tambahkan gadget, pilih HTML/Javascript dan masukkan kode diatas..... jadi dech.

Nah bagi anda yang ingin tahu hasilnya silahkan lihat contohnya di Sharing Post, semoga membantu.