Monday, December 14, 2009

How to integrate google wave for your blog.

I have been interested in google wave for some time now. once I want to integrate google wave for this blog post. I surfed the Internet but I didn't found a proper solution. Google wave embed API is not warking for blogspot blog.

Here is my Solution. ( Actually I used wave API)

1. Go to Layout -> Edit HTM in your Blogspot Blog.
Insert this code to your between <head> elements of your Blog.

<script type="text/javascript" src="http://wave-api.appspot.com/public/embed.js">
</script>
<script type="text/javascript">
function waveScrypt() {

var div = document.getElementsByTagName('div');
for (var i = 0; i < div.length; i++) {
if( div[i].id.substr(0, 5) == 'wave_' ) {
var id = div[i].id.substr(5, div[i].id.length-5);

var wave = new WavePanel('https://wave.google.com/wave/');
wave.setUIConfig('white', 'black', 'Arial', '13px');
wave.loadWave('googlewave.com!w+' + id);
wave.init(document.getElementById(div[i].id));
}
}
}
</script>


2. find the <body> Tag and replace it as like this.

<body onload="waveScrypt()">

3. Now you can simply add a wave to your posting area using this code.

<div id="wave_waveid" style="width: 400px; height: 420px"></div>

waveid is your wave id which you want to publish.

Example:
<div id="wave_GCW5356" style="width: 400px; height: 420px"></div>