Notebook / Archives

The Making-Of a Blog: displaying your online status

« Small visual bug corrected / \ I need to work on my stylesheet »

April 28, 2003

The Making-Of a Blog: displaying your online status

It could be very useful to display your online status on your weblog, that is to say which instant messaging network you are connected on when someone is visiting your website.
Almost all instant messaging companies are providing tools to actually perfom that job:


  • ICQ offers the more powerful tools, "The ICQ Web Tools" which are covering many aspects of the ICQ network. Among these tools, there are "The ICQ Panels", which provide “basic ICQ features to empower your site, while each panel has unique features & design to fit your site perfectly”. On this page you can easily find "The ICQ Status Indicator", with actually ten different designs. For example, if you want a soft and little ICQ status indicator, you just have to add the following HTML code in your webpage, where the indicator must appear:

    <img src="http://web.icq.com/whitepages/online
       ?icq=[your_icq_number]&img=5">


  • AOL Instant Messenger (AIM) only provide the "AIM Remote", a way to add an AIM communication center to your website (a panel to contact you by instant messaging or email, to join your chat room, etc.).

  • Yahoo! just offers an online presence tools for its Yahoo! Messenger. Here is the HTML code if you want to compare it with ICQ's one:

    <a href="http://edit.yahoo.com/config/send_webmesg?
       .target=[your_yahoo_id]&.src=pg">
    <img border=0 src="http://opi.yahoo.com/online
       ?u=[your_yahoo_id]
       &m=g&t=2"></a>


  • Microsoft does not provide a MSN/Windows Messenger presence tools. This is a strange situation because the Hotmail email service displays your friends' online status if you have received emails from them...

So as you can see, you will have much work to do for a result which won't look homogeneous. Hopefuly here comes the Online Status Indicator, OSI for intimates! This is a service which allow you to display a small image on your website to show if you are online (OSI can handle ICQ, MSNm, AIM, Y!M and Jabber – there are icons for Trillian but the OSI server uses the ICQ account in order to detect your presence). You can use the default icon (the one on the OSI server) or create your own for online and offline status. You can too host yourself an OSI server (written in Java): all you need is a permanent internet link.
I see two main servers with different icons: "lifelesspeople.com" (actually down) and "inkiboo.com" (more servers on the OSI WebRing).
You will have to create each icon separatly: you must select the medium (the instant messaging network), fill the user id (your id on this IM network) and the addresses to online and offline icons (it's a good idea to put them on your website to minimize the loading time of your page).

Example of the HTML code needed for AIM (note that the online and offline adresses for icons must not contain "http://"):


<!-- Begin Online Status Indicator code -->
<!-- http://www.onlinestatus.org/ -->
<A HREF="aim:goim?screenname=[your_aim_pseudo]">
<IMG SRC="http://status.inkiboo.com:8080/aim/[your_aim_pseudo]
   /onurl=[address_to_online_icon]
   /offurl=[address_to_offline_icon]"
border="0"
   ALT="Online Status Indicator"></A>
<!-- End Online Status Indicator code -->

If you put like me your online and offline icons in media/images/im_osi_icons/ with respective names aimonline.gif and aimoffline.gif, using Movable Type variables (MTBlogHost to get the hostname of your blog and MTBlogRelativeURL to get its relative URL), you have (using lower case tags and a more meaningful “AIM Online Status Indicator” for the alt tag):

<!-- Begin Online Status Indicator code -->
<!-- http://www.onlinestatus.org/ -->
<a href="aim:goim?screenname=[your_aim_pseudo]">
<img src="http://status.inkiboo.com:8080/aim/[your_aim_pseudo]
   /onurl=<$MTBlogHost$><$MTBlogRelativeURL$>
   /media/images/im_osi_icons/aimonline.gif
   /offurl=<$MTBlogHost$><$MTBlogRelativeURL$>
   /media/images/im_osi_icons/aimoffline.gif"
border="0"
   alt="AIM Online Status Indicator"></a>
<!-- End Online Status Indicator code -->

Repeating this process for all your favorite instant messaging networks, you get:

<!-- Begin Online Status Indicator code -->
<!-- http://www.onlinestatus.org/ -->
<a href="http://status.inkiboo.com:8080/message/icq/[your_icq_number]">
<img src="http://status.inkiboo.com:8080/icq/[your_icq_number]
   /onurl=<$MTBlogHost$><$MTBlogRelativeURL$>
   /media/images/im_osi_icons/icqonline.gif
   /offurl=<$MTBlogHost$><$MTBlogRelativeURL$>
   /media/images/im_osi_icons/icqoffline.gif"
border="0" alt="ICQ Online Status Indicator">
</a>
<a href="http://status.inkiboo.com:8080/message/msn/[your_msn_id]">
<img src="http://status.inkiboo.com:8080/msn/[your_msn_id]
   /onurl=<$MTBlogHost$><$MTBlogRelativeURL$>
   /media/images/im_osi_icons/msnonline.gif
   /offurl=<$MTBlogHost$><$MTBlogRelativeURL$>
   /media/images/im_osi_icons/msnoffline.gif"
border="0" alt="MSNm Online Status Indicator">
</a>
<a href="aim:goim?screenname=[your_aim_id]">
<img src="http://status.inkiboo.com:8080/aim/[your_aim_id]
   /onurl=<$MTBlogHost$><$MTBlogRelativeURL$>
   /media/images/im_osi_icons/aimonline.gif
   /offurl=<$MTBlogHost$><$MTBlogRelativeURL$>
   /media/images/im_osi_icons/aimoffline.gif"
border="0" alt="AIM Online Status Indicator">
</a>
<a href="ymsgr:sendIM?[your_yahoo_id]">
<img src="http://status.inkiboo.com:8080/yahoo/[your_yahoo_id]
   /onurl=<$MTBlogHost$><$MTBlogRelativeURL$>
   /media/images/im_osi_icons/yahooonline.gif
   /offurl=<$MTBlogHost$><$MTBlogRelativeURL$>
   /media/images/im_osi_icons/yahoooffline.gif"
border="0" alt="Y!M Online Status Indicator">
</a>
<!-- End Online Status Indicator code -->

In conclusion I can say that I am very impressed by the Online Status Indicator, particularly the click-and-contact functionality: if you click on one of the presence icons while having your instant messaging client opened, you will be able to send a message to your contact (for AIM and Y!M, using their respective protocols via a web link, generating the appropriate data flow via the OSI server for ICQ and MSMm).

However I think a complete hosted-on-your-MTBlog Perl solution could be nicer. But this is another story I would tell to you later this year...

Posted by Jean-Philippe on April 28, 2003 at 09:26 PM 36 Comments, 253 TrackBacks

Filed in instant messaging, making-of, my website

Post your own.

Comments

18

twatkkfbo.qijmjqqf, http://www.bwmospdcgh.com/ fhrgqueonp

Posted by syiczfdqjs on November 25, 2013 at 08:50 AM (Spam: 50%)

23

rapjjkfbo.qijmjqqf, http://www.aljsxefkdz.com/ uqvwtrckfi

Posted by ufarxmxiof on December 21, 2013 at 01:45 PM (Spam: 50%)

27

wewwvkfbo.qijmjqqf, http://www.izhpiwqiow.com/ dosedfdluy

Posted by xjnhqreiqw on January 25, 2014 at 10:42 AM (Spam: 50%)

31

bnfmvkfbo.qijmjqqf, http://www.mnguktmass.com/ imihzrmavf

Posted by jouctypxlb on February 10, 2014 at 06:48 PM (Spam: 50%)

35

gsggxkfbo.qijmjqqf, http://www.etqphmqebz.com/ koliggjhgm

Posted by xjwhbruacf on December 13, 2014 at 05:52 AM (Spam: 50%)

Post a comment
Security Code Check





Remember personal info?


Entries by category

Entries by month