How to create a iGoogle Widget!

by Pieter Brinkman 14. January 2008 13:43

Because every eveloper needs to have a New Guid generator and .Net info search iGoogle widget ;-). It was time for me to create one!

I had no idea where to start, try searching Google no good results. But after clicking along on iGoogle I found the Google Gadgets developer site. After reading some documents and playing with some examples I found out that it is to easy to create a iGoogle widget. Here is a ... step guide to create a iGoogle widget.

In this guide where going to load an external website (http://www.newguid.net/iGoogle_CreateGuid.aspx) in the widget (the most easy way to build a widget).

Step 1:
Go to the Google getting started document and scroll down to the Google Gadgets Editor. Here you can try out some examples or insert your own code.

Step 2:
Insert the following code to the Gadgets Editor 

[code:html]
<?xml version="1.0" encoding="UTF-8"?><Module>  <ModulePrefs title="[Widget Title]" height="100" author="[Author Name]" author_email="[Author Email]" description = "[Widget Description]" screenshot = "[Link to a Screenshot]" thumbnail = "[Link to a thumbnail]" author_link = "[Link to author website]"><Require feature="dynamic-height"/>  </ModulePrefs>   <Content type="url" href="http://www.newguid.net/iGoogle_CreateGuid.aspx"/></Module>
[/code]

Press the Preview tab. You will see that the New Guid widget is already working. The widget just loads the website within an Iframe. The best thing is that you only have to design an build your widget once on your own server. It is a normal page so there aren't any design limits.

Step 3:
Save and Publish your widget. You have to change all properties (eg. title, author, author_email, etc.) in de code before you save and publish your widget. After you've changed the properties you can just save and then publish your widget. You can either publish your widget on your webpage (just by linking to it) or publish it into the Google Directory or both.

Publish your gadget in the editor by going to File > Publish. This button is only clickable if your syntax is correct.

Your gadget will be validated before the real publish. Fix all the issues that show in popup (see image below). And retry.

 

 

Like I told you to easy. Ofcourse you can do mutch more with it, but this will do for most of your widgets.

 

Tags: , ,

Google

Comments

4/29/2009 9:30:26 AM #

VINKAS India

Wow. Its very useful. But how can i publish this in google.

VINKAS India India

5/28/2009 2:32:09 AM #

Walt

The preview in step 2 didn't work for me. Instead, I get an error:


Error parsing module spec:
line 3, column 7

   &nbsp; <ModulePrefs title="[Widget Title]" hei...

XML parse error:
Entity 'nbsp' not defined

Walt United States

6/25/2009 5:41:42 AM #

Seattle dating

Thanks for the step-by-step instructions of doing it.

Seattle dating United States

7/8/2009 10:23:34 PM #

club penguin cheats

Its very useful. But how can i publish this in google.

club penguin cheats United States

7/9/2009 7:57:58 AM #

Pieter

Hi,

I updated the post (step 3: save & publish) with more information about publishing. If you have more questions let me know.

Cheers,
Pieter

Pieter Netherlands

7/24/2009 7:12:04 AM #

movie online

Wow. Its very useful. But how can i publish this in google.

movie online United Kingdom

Powered by BlogEngine.NET 1.5.0.7
Theme by Mads Kristensen

About Me

My name is Pieter Brinkman I am Solution Architect for Sitecore in The Netherlands. My interests are mainly ASP.NET, MSSQL and Content Management Systems.

Calendar

<<  February 2012  >>
MoTuWeThFrSaSu
303112345
6789101112
13141516171819
20212223242526
2728291234
567891011

View posts in large calendar

RecentComments

Comment RSS

Most comments