The steps for converting the previously created widget into a gadget are:
Step 1: Create a gadget.xml file
Add a new xml file to the ProductWidget web site and call it gadget.xml. The contents should look similar to the following:
<?xml version="1.0" encoding="utf-8" ?>
<name>AdventureWorks Product Gadget</name>
<author name="Built To Roam">
<info url="https://blogimages.builttoroam.com/nick" text="Nick's .NET Travels" />
<logo src="BTRLogo.png" />
<copyright>Copyright (c) 2009 Built To Roam. All rights reserved.</copyright>
<description>Basic product gadget based on ajax 4</description>
<icon width="64" height="64" src="BTRLogo.png" />
<base type="HTML" apiVersion="1.0.0" src="Products.htm" />
<platform minPlatformVersion="0.3" />
Step 2: Make minor layout changes to ensure content is visible
Unlike a widget, where it will be rendered in full screen on the Windows Mobile device, a gadget needs to know what size to render itself. A simple way to do this is to define the width and height on the body tag in the Product.htm file.
sys:activate="*" style=" width:300px; height:500px" >
Step 3: Zip files and name as .gadget
You are essentially done with making changes. All you need to do now is zip up the files, as you did when creating the widget, and name the file with .gadget extension. Note that you can include the config.xml and gadget.xml file in the same zip file without them conflicting. This is useful if you want to build a single widget/gadget that will work across Windows Vista/7 and Windows Mobile 6.5.
Step 4: Double-click your gadget to install
When you double-click the newly created gadget it will install and run your gadget.
Again, apologies for the awful design work. You’ll also not that for some reason when you click on a category it doesn’t highlight the category or load the products associated with it. Something in the Ajax4 library must be malfunctioning for it not to work properly as a gadget (any suggestions are welcome!!).