How to create a iGoogle Widget!

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)

Because every eveloper needs to have a New Guid generator and .Net info search iGoogle widget How to create a iGoogle Widget! icon wink . 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.

How to create a iGoogle Widget! image.axdpicture2009%2f7%2fpublish+gadget

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

 How to create a iGoogle Widget! image.axdpicture2009%2f7%2fgoogle+publish+gadget+validation

 

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

 

VN:F [1.9.22_1171]
Rating: 0.0/10 (0 votes cast)
How to create a iGoogle Widget! Pieter Brinkman avatarAuthor: Pieter Brinkman ()

Pieter is Technical Marketing Manager for Sitecore Netherlands and owner of Gaatverweg.nl. He has more than ten years experience with software developing in multiple programming languages and with different Content Management Systems. Before joining Sitecore Pieter was a lead developer for multiple Sitecore and .Net projects, he joined Sitecore in 2011 as an Solution Architect in The Netherlands, after two years as an Solution Architect he joined the Technical Marketing department. In the role as Techinical Marketing Manager he is responsible for the Global MVP program and the Sitecore technical branding strategy. You can follow Pieter on twitter: @pieterbrink123 or Google+

How to create a iGoogle Widget! WebsiteHow to create a iGoogle Widget! TwitterHow to create a iGoogle Widget! Google PlusHow to create a iGoogle Widget! Linkedin

6 Responses to How to create a iGoogle Widget!

Comments
Tweets
Pingbacks