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:

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

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/

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

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

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:

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:

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.

Enjoyed this post? Subscribe to Online Tech Tips via RSS Feed or via Email and receive free daily productivity tips.

» Filed Under Cool Websites

Save this page	Stir it up on Mixx
Add to Reddit	Stumble this page

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

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

Thanks.

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

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

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

where can i paste the code…

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?

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