Friday, January 14, 2011

Google Docs on Google Sites

My friend and I are making a game together, but we dont live close by. So mostly we use Google docs to write the storyline and other simple documentation. So because Google made it easy to use we also put together a Google Site Page for our project. But when we wanted to put our documents onto our site we noticed that it felt less profesional (even though using google sites in the first place is less profecssional). Regardless I wanted a way to view specific documents while not leaving the site. So I tried publishing the documents but that was even worse becasue the width of the page was the 100% width of the browser window. From that i wondered if I could embed the document within the site page, and that worked like a charm. the only problem was that we have lots of different documents and we dont want to create a seperate page for all of them. So I created Gdoc Display gadget. It lets you dynamically load published Google docs into your web page, and resized the web page so that the entire document fits without having to put in an extra scroll bar. The way it work is by looking at the url of the page for the document ID number. For example if your site was called "gamesite", the URL would look something like http://sites.google.com/~/gamesite/. so you would make a page called docs and put the gadget on the page, and the url for that page would be ~/gamesite/docs so in order to actually load a document you need to put the ID on the url so in order to do that wherever your hyperlink is you put ~/gamesite/docs?DOCID where DOCID is the ID number of the document. In order to find the document ID number you look at the URL for the published document. At the end of it there is a ?id= and then a long number copy that number and there you go. Now, in order to add the gadget to the page you need to add a gadget by URL and use: http://hosting.gmodules.com/ig/gadgets/file/116731940771101949147/gdocdisplay1-0.xml once you have done that you are good to go. Any update to the gadget will be automatically applied to your web page as well.