How to add Yahoo Chat Pingbox to your website

Posted on November 20, 2008 at 5:34 am

Yahoo! Messenger Pingbox allows you to have an IM like interface in your blog or any website. Visitors of your site can chat with you real time whenever you are online.  Since it becomes a part of your blog it doesn’t require your visitors to install any application.  This is very similar to the Google Talk ChatBack Badge from Google that you can use to chat with visitors to your website.

If I am online you will see me as “Available”. All messages sent to me when I am “Available” will be sent real time to my Yahoo! Messenger.  On my side I can see from my Yahoo! Messenger all visitors browsing the page:

image

I sent a message from the Pingbox and it appeared on my screen as “Visitor 1”:

image

I can then reply to “Visitor 1” using the YM window above.  Pretty cool isn’t it?

To start making your own Pingbox just go to the URL below:

http://ph.messenger.yahoo.com/pingbox/

Login using your own Yahoo! account then click the “Create Pingbox” button:

image

The first step pf creating a Pingbox is to chose a background theme.  Choose what design suites your taste:

image

Make sure to enter your customized greeting, offline message, display name and name of Pingbox (will appear as a group in your YM contacts):

image

Then click the Next button to access the  next page where we could get the script.  The second page allows you to choose which website to add Pingbox, choose “Code only” if you want to directly paste to your HTML file otherwise choose your type of website.

The next step will be setting the size of the widget, in the example below I chose the recommended 240 X 240 px size.  The third box will be the actual code, copy the code only AFTER you choose the size and type of website:

image

You can paste the code into your HTML files using your favorite HTML editor and test it using your web browser.   Below is the screenshot of the steps I did:

image

Have fun adding your own Pingbox to your webpages.  You can use it to gather realtime feedback from your viewers.

Ben Carigtan shows you how it’s done.

» Filed Under Cool Websites

Related Posts

Comments

14 Responses to “How to add Yahoo Chat Pingbox to your website”

  1. mmg1818 said on : November 20th, 2008 at 1:06 pm

    Thanks.


  2. freepayabe said on : December 12th, 2008 at 5:51 am

    thanks! i see the pingbox is on if my friends are online


  3. printen said on : March 12th, 2009 at 1:24 am

    where can i paste the code…


  4. venkat said on : March 14th, 2009 at 5:17 am

    I installed pingbox code in my page. I can see with IE but not with firefox.

    Should I add any other code for that?


  5. Jason said on : June 14th, 2009 at 11:10 am

    Does not work in a hosted version of WordPress…


  6. Pamela said on : August 17th, 2009 at 7:41 am

    No matter whether I show online or not, the icon showing in my pingbox never shows me as online, and nobody can type in it. I have followed all of the instructions, a few times too!! and still cant work… Any ideas?


  7. stephan said on : October 17th, 2009 at 5:34 pm

    Thanks for this post.

    I found a bug. Does not work with IE or Firefox if it has never gone on to the yahoo website, a cookie seems to be needed !!!

    If anybody has any good ideas on how to correct this, let me know!

    Best regards.


  8. sariah said on : December 8th, 2009 at 6:57 am

    Thanks very much, I just added a Pingbox chat to my website! :)


  9. stephan said on : December 8th, 2009 at 3:03 pm

    Hi,

    Too much trouble with yahoo messenger pingbox !!!

    I found something better : Digsby

    Best regards.


  10. Jeff said on : December 17th, 2009 at 6:52 pm

    Great tutorial…Check out this video for more help on how to integrate Ping Box live chat on the website. It might be helpful to visitors on your website.

    youtube.com/watch?v=aC4MGPmBq24 (copy and paste)


  11. Chattar said on : February 12th, 2010 at 1:41 am

    Yahoo pingbox is free to use on your web page and works well.


  12. stephan said on : February 12th, 2010 at 10:44 am

    Chattar said “Yahoo pingbox is free to use on your web page and works well.”

    Wrong !!!

    If visitor as nerver visited yahoo webpage, pingbox doesn’t work at all !!!

    You can verify by erasing IE cookies , and see .

    Visitor, like me, will never see your chatbox, only a blank space .

    It is an yahoo pingbox bug.

    Regards


  13. susmitha said on : February 23rd, 2010 at 3:27 am

    what should i do after paste the Yahoo Pingbox code on my website?


    Pingbacks
  1. What’s new in Yahoo! Messenger 9? Says:

    [...] To remedy this problem, a contact search bar is now available.  Status messages are also easily changeable as the GUI provides editable status message textbox on the main window. The Pingbox visitors on your Pingbox appear as groups on your contact panel.  (We have a separate article for Yahoo! Pingbox here) [...]

    November 30th, 2008 at 5:15 am
Please post your comments/suggestions!