Since joining forces with Ben about 6 months ago, we have had a blast creating and testing out new features (both internal and public). Along the way, we have iteratively improved the flexibility of our widget styling, core Javascript, and backend services to make customization easier.

We feel that it’s time to start exposing some this flexibility outside of the founding team here at Olark. Why? Well, it turns out that we are hitting a pretty broad range of customers: ecommerce sites, small businesses, realtors, freelancers, lawyers, and more. You can imagine that each of these customers has specific needs for their business.

The most-requested features definitely get our full attention, but obviously we can’t incorporate every idea that comes our way. So now we invite you, the designers and developers of the world, to start working with us. If you’re setting up a website with Olark, you can customize the look and behavior to fit the specific needs for your business.

Our first step is offering full CSS styling, for designing custom themes. Designers can get access to this immediately from our plans page. We are still testing out pricing models for this, and right now we ask that you keep our branding intact. Please give us your feedback!

Our next step is a new Javascript API, for developing custom behaviors. With the current version of the API, you can do basic plugins like the example below. This example changes the visitor screen name to their geolocation. Instead of seeing “webuser1234” in your buddy list, you will see “Mountain View, CA, USA” or “London, UK”.

<script type="text/javascript" src="http://www.google.com/jsapi?key=YOURGOOGLEJSAPI_KEY"></script>
<script type="text/javascript">

var config = wc_config();

if (google && google.loader && google.loader.ClientLocation) {
    config.vars.force_nickname = ""+
        google.loader.ClientLocation.address.city+", "+
        google.loader.ClientLocation.address.region+", "+
        google.loader.ClientLocation.address.country;
}

wc_init("YOUR_HABLA_SITE_ID", config);

</script>

Over the next month, we will be releasing an upgraded Javascript API to allow easy triggers for important events (e.g. shopping cart failures) and simple hooks into our message system, with jQuery at the core. If you are a developer and have some great ideas of what you would like to see, please get in touch with me on my Olark at mjpizz.com or on Twitter.

-Matt @mjpizz

I pushed out the latest version of the Hab.la JavaScript tonight. (I actually have been slowing rolling it out over the past few hours, but it is completely deployed now)

Before we do any deploy we test the JavaScript with IE6, IE7, Firefox, Safari, and Opera. It’s funny how you need to make simple tweaks for each browser and so the Javascript will compress correctly. Funny in that so much time is essentially wasted because Microsoft didn’t listen to W3C standards.

The new JavaScript should be completely backwards compatible with the old setup. Please let us know if you did a lot of customization on Hab.la, and your customizations no longer work.

The most interesting aspect of the new JavaScript is it’s support for dynamically loading themes and plugins, and the ability for Hab.la users to customize their Hab.la windows without having to write JavaScript. (We will be rolling out a control panel for managing these features soon).

In any case the transition should be relatively transparent for most users. We will be adding documentation on the new features this week.

I spent today honing my Google gadget writing skills. Unfortunately Google Gadgets that work on Google Pages are wrapped in IFRAMES so I couldn't make a gadget to embed the floating Hab.la into your Google page. (Though you can still paste the HTML into Google page) We need to do a little bit more testing before we add the Gadget to the various Google Gadget directories. The below link is pretty much useless, as it will just add the Hab.la widget to your iGoogle web page.

What you really want to do is log into your google pages account (Pages.Google.com) and edit a page on your site, near the bottom of the screen is an [Add Gadget link], choose to add a gadget from a URL, and as the URL specify: http://static.hab.la/html/habla_gadget.xml
 
You'll need your Hab.la Site-ID which can be found on your account page, pull out the series of numbers passed to the wc_init() function. If you examine the code wc_init("___THIS_IS_YOUR_ID___")

That's it for now, in other news I've been revamping the JavaScript API that drives the display of hab.la on your page, and pretty soon there will be documentation explaining all the cool things you can do with your hab.la window.

One last thing, the MySpace and BlogSpot Hab.la tutorials are on their way :-)

This is a few days old but I thought I should post it here.

Eventually we want to have a fairly substantial API for customizing Hab.la in Javascript. For now I've implemented a couple simple calls to change the default away message. First you can add a link to a custom contact page:

cb.setAwayLink("http://mysite.com/contact.html");

Or you can completely replace the away message:

cb.setOfflineMessage("I've completely replaced the away message!");

OK, not really that exciting. Not sure if we really need two separate calls there either.