Using custom Google Gadgets to enhance Google sites

What is a Google Gadget?

Because your ability to directly customize a webpage built with Google sites is a little limited (there are limits on using CSS and Javascript), one tool you have to customize a Google site is a Google Gadget. A Google Gadget is basically a special piece of software code that you can insert into a Google site.

Use a Publicly Available Google Gadget

Hundreds of people have written Google Gadget's and have made them publicly available on the internet. From within a Google site, click on the "insert" menu and then select "more gadgets". You will see tons of public Google Gadgets that you can use in your Google site.

Write Your Own Custom Google Gadget

A Google Gadget is a XML file with a specific syntax. Once you write it, you have to have a place to host it on the internet. So, if you have your own website, you can save the XML file somewhere on your website. Alternatively, Google will host your Google Gadget for you: see http://code.google.com/apis/gadgets/docs/tools.html). Once it is hosted, you then point to it from your Google site page. From within Google sites, you select "insert" and "more gadgets" and then "add gadget by URL". You then give it the URL of your XML file that you saved on your website or with Google.

A Sample Custom Google Gadget That Executes Javascript

A custom Google Gadget is one way that you can include a Javascript function in your Google site page. For example, here's a simple custom Google Gadget that includes a Javascript function:

<?xml version="1.0" encoding="UTF-8" ?>

<ModulePrefs

author="Aslak Grinsted"

author_link="http://www.glaciology.net"

scrolling="false" >

</ModulePrefs>

<Content type="html"><![CDATA[

<h1>testing</h1>

alert('HELLO!');

</script>

]]></Content>

</Module>

Save this XML as an XML file and then host it somewhere. You can then reference it from within your Google site.

A Sample Custom Google Gadget That Embeds Another Webpage Into Your Google site

A custom Google Gadget is one way that you can include another webpage in your Google site page. For example, here's the XML for a simple Google Gadget to put a frame in your Google site page:

<?xml version="1.0" encoding="UTF-8" ?>

<ModulePrefs title="Iframe test"

directory_title="iframe test"

description="iframe"

author="Aslak Grinsted" author_email="rek@phunck.cmo"

author_link="http://www.glaciology.net"

scrolling="true"

category="funandgames">

</ModulePrefs>

</Module>