Thursday, July 30, 2009

How to add a Google Wave to your Blogspot Blog

If you scroll to the bottom of my blog, I have embedded a Google Wave for you to take a look at. Of course, this only works if you have access to the wavesandbox, so if you don't have access yet, you'll only see a canned Google Wave Developer Release notice. For those of you who do have access to the wave, however, you should be able to see the wave. I am going to try to add some functionality to allow one to join the wave right from the blog. However, if you want me to add you to the wave, just drop a note in my comments. The more the merrier!

Here is the process that I followed to embed the wave in the blog.

From blogspot dashboard, I clicked on 'Layout-->Edit Html'. Then, I put the following code into the template (in the <head> section).


<head>

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


  function initialize() {
var wavePanel = new WavePanel( 'http://wave.google.com/a/wavesandbox.com/' );
wavePanel.loadWave( 'wavesandbox.com!w+waveID' );
wavePanel.init( document.getElementById( 'waveframe' ));
}

</html>




Note that I had to replace the 'waveID' with the actual ID of the wave I want to embed. The easiest (only?) way to get the WaveID is to open the wave-client at the wavesandbox, click on the wave, and then click on 'debug-->Get waveID'.

Next, I scrolled down to my Main Wrapper section of the template and added the following <div> snippet of html


<div id="waveframe" style="width: 500px; height: 100%">



Finally, I modified the <body> tag to call the initialize function, like so:


<body onload="initialize()">



And that's it! Now the wave is embedded at the bottom of my blog.

Note: I'm not sure if I absolutely had to add blog-wave@appspot.com to my wave for this to work or not, so I am going to do some more testing to see what I come up with. My sense is that one can embed the wave into the Blog without having to use the blog-wave robot.

3 comments:

  1. You could simply add
    public@a.gwave.com
    to the wave, then it becomes public!

    ReplyDelete
  2. I have been looking into how to add it to my blog. Is the sandbox completely different than google wave? ie there is another thing that I have to wait to try to get?

    Is there any other way to embed the wave into my blog?

    ReplyDelete
  3. You can use the embed API, but you have to know your wave server and wave id

    ReplyDelete