Widgetbox

---

Widgetbox makes it easy to make new widgets from scratch or from your existing widget-sized Web Page, Flash file or RSS feed. You can also import your Google Gadget.

Table of Contents

Making and Distributing Your Widget

Here are the key steps in making and distributing a widget.

Sign Up	Create a free Widgetbox account. You can use the same account to make widgets as well manage the widgets you’ve installed on your favorite site(s).
Make A New Widget	Access the Make A New Widget start page . Create a new HTML/JS widget from scratch or make a new widget using your existing content. Initially your new widget will be a private, unlisted widget — meaning it can only be accessed via its unique Widget URL. Your widget can not be found by users when they search the Widgetbox gallery.
Test Your Widget	Your widget’s Widget Dashboard provides you a Test Widget link that allows you to view your widget as others will see it. Install your widget to your favorite site. Ensure that it functions as you intended. Send your widget’s Widget URL to your friends or colleagues so that they can try it out, too.
Submit to Gallery	When you’re sure your widget works, submit it to the Widgetbox gallery. This is done by completing a simple form that describes your widget.
Wait for Approval	We look at each widget to make sure it functions correctly and meets our widget publication criteria. We generally approve widgets within a day, sometimes two. If there are problems, we will reject the submission and will identify the issues that need to be fixed.
Widget Metrics	From your widget dashboard, you can access metrics such as how many people have subscribed to your widget, how many times your widget has been viewed and the websites where it’s been installed.
Updating your Widget	You can continue to make changes to your widget after it is listed in the gallery. You can preview your changes without affecting users who have already installed your widget. When you’re ready to broadcast changes to these existing copies of your widget, simply press the Publish Changes button we provide.

Types of Widgets

Widgetbox allows you to create a new HTML/JS widget from scratch or make a new widget using your existing content:

HTML/JS Widgets	An HTML/JS widget includes HTML and/or JavaScript code you enter into the Widgetbox editor. If you have an existing widget that generates a <script> tag that a user puts on a site, choose this option. Any per-user variables within your tag can be placed into a Widget Settings form containing fields where users can specify a value. You can also build entirely new widgets using this facility. More on HTML/JS widgets.
Web Page and Flash Widgets	These are widgets that you host yourself, “remote” from Widgetbox, such as a widget-sized web page or SWF file. Flash widgets, such as those that use an <embed> tag. More on Flash Widgets. Widget-sized web pages. If your web page widget makes use of query string parameters to dynamically change the content displayed, you can graphically create a Widget Settings form that allows users to specify these values. More on Web Page widgets.
Blidgets (Blog / RSS Widgets)	A Blidget is a widget that displays your blog. Simply provide the URL to your Blog or RSS feed and Widgetbox will create a new widget that displays its content. More on Blidgets.

Hello World Widget

When you make an HTML/JS widget, you can begin by using our “Hello World” example widget. This widget demonstrates how you can use Widget Settings in your Widget Code to create a user-customizable widget.

Comments built into Hello World’s Widget Settings and Widget Code will help you understand the interaction between these two panels. Here’s how to get started:

1. Access the Make a New Widget start page.
2. Click “HTML / JS”.
3. Accept the default options shown below.

4. Click Continue

Good start! You’ve just made a widget named “My Widget”. It’s not shared in the Widgetbox gallery, so play around with it as much as you like!

Widget Settings

The most successful widgets allow users to customize the content displayed within them. Here are some common examples:

• Text fields that ‘tune’ a news or search widget.
• Drop down menus that adjust colors/fonts/other formatting options.

Widgetbox helps you to graphically create a user-facing configuration form, called Widget Settings, for your widget. When a user changes a Widget Setting, this information is passed to the widget. Widgetbox passes the information to each type of widget differently:

• HTML/JS Widgets: Widgetbox embeds a Widget Setting at spot in your widget code as determined by simple replacement tags, as described in HTML/JS Widgets.

• Flash Widgets: You have the option passing each Widget Setting via the URL, as a FlashVar, or a plugin value as described in Flash Configuration.

• Web Page Widgets: Widget Settings are passed as URL query string parameters. For example, if the Widget Settings form contains a setting called “myParam”, it it sent to the remote widget as domain.com/path?myParam=value

Links

The most common problem with widgets is in its links. Widgetbox renders each widget in an iframe and thus its links need to target _new or _blank or _top. One way to automatically do it for all links in the widget is described here.

What makes a good widget

1. Form factor. The most common place to put a widget is in a blog sidebar. The default TypePad sidebar fits a widget that’s a maximum of 170 pixels wide. If you are targeting sidebars, we recommend your widget be able to be squeezed to that. The best is to give people a choice of form factors.
2. Customization. Users love to be given choices in how to display the widget. Give lots of options as far as the size, colors, fonts, placement of logos and content within the widget. If your widget displays a list of items, give the user a choice of how many items to display.