Widgetbox requires widgets that are registered in our gallery be Ad Compliant. The Ad Compliant program allows Widgetbox to display ads on widgets in circumstances where ads are allowed or should be displayed. Unfortunately, defining what is or isn’t an ad is not black and white. Below you will find the Widgetbox guidelines that that will help determine what is considered an ad and what is not.

The best practice would be to ask the Widgetbox support team for their opinion while you are building you widget, before you submit it to the gallery for items that you are not sure of. Our goal is to have a program that benefits all users of Widgetbox and we are happy to answer any questions you may have and we are also open to any input that you have which might make our program more successful for all.

Guidelines

Widgetbox buckets the Ad Compliant issues into three categories which are defined below:

Attribution

Widgetbox defines attribution as attributing credit to the author of the work. Attributions are not dynamic and do not change. Although the presentation and style may change, the attributed creator should not. Attributions can be the individual or company that is promoting the widget or a third party that created the widget for an individual or company. Attributions that meet the Widgetbox guidelines will be considered Ad Compliant.

Promotion

Widgetbox defines promotion as a general sponsorship of the widget by the widget creator or the individual or company that the widget account is registered to. Promotions are not considered advertisements and are considered Ad Compliant by Widgetbox.

Ad

Widgetbox defines ads as any promotion within the widget designed to increase consumption of products or services that are not produced by the makers of the content in the widget. Basically any third party ad such as Google Ad Sense, Mochi Media ad, or any overlay, pre roll, post roll, .jpeg, .gif, video or other format that is advertising third party products or services.

• Using Facebook to Join Widgetbox
• Connecting to a Different Widgetbox Account

Using Facebook to Join Widgetbox

You can quickly sign up with Widgetbox using your Facebook account. This makes it easy to join Widgetbox using Facebook Connect, saving you from having to remember yet another username and password login. Join Widgetbox by using your Facebook account by following the steps below.

1. Click the "Join Now" link located in the top-right corner of the Widgetbox header.
   
2. In the Join Now dialog, click the Facebook "Connect" button.
   
3. If you're not currently not logged into Facebook, a Facebook Connect window will pop up. Enter in your email and password for your Facebook account and then click the "Connect" button.
   

   If you're currently logged into Facebook, a Facebook Connect dialog will display. Review your login status for your Facebook account and then click the "Connect" button.

   

You should now be signed into Widgetbox and your Facebook account should be connected to the newly created account.

Connecting to a Different Widgetbox Account

If you realize you already have a Widgetbox account after you connected to a new one, you can connect to a different Widgetbox account by following the steps below.

1. Click the "My Account" link located in the top-right corner of the Widgetbox header.
   
2. On your Account Profile page, scroll down to the Facebook Connect section and click the "disconnect" link.
   

   You may then be prompted to complete signing up for a standalone Widgetbox account. You can choose to keep your account by completing the signup or abandoning the new Widgetbox account by canceling it.

3. Sign out of your current Widgetbox account by clicking the "sign out" link in the top-right corner of the Widgetbox header.
4. Once signed out, sign into the Widgetbox account you want to connect with your Facebook account. Click the "Sign In" link (located in the header) and enter your username (or email address) and password.
   

   If you're having trouble remembering your password, click the "Forgot password?" link to have Widgetbox email you a password retrieval link.

5. After signing into the Widgetbox account you want to connect, click the "My Account" link and scroll down to the Facebook Connect section once again.
6. Click the Facebook "Connect" button to have the Connect with Facebook window pop up.
   
7. Log in or review your login status with Facebook and then click the "Connect" button.
   

   The Widgetbox account you're currently signed in with should now be connected with your Facebook account.

If you're still experiencing issues trying to connect to a different Widgetbox account, email us:

Hi there, website owners.

Hello, bloggers.

Welcome, Facebook and MySpace users (and all you other social networkers, too).

Whatever you’re doing on the web - blogging, friending, or doing business - Widgetbox widgets make your site or profile more fun, friendly, and functional.

We have the web’s biggest selection of widgets for every purpose: games, calendars, news feeds, and every species of bling you can imagine.

And we make it easy for you to get those widgets, customize them, and put them into play, with just two clicks. No rocket science (or coding) required.

The Viral Installer consists of code that allows users to customize and grab your widget from a non-Widgetbox site.

The code contains two key sections:

1. A hidden form that includes all of the configurable widget values you defined when registering your widget on Widgetbox.
2. Javascript that displays a Get Widget link. When a user clicks Get Widget, the same Javascript starts the widget installation process using any values you may have provided to the hidden form.

A Step-by-Step Example

How do you get the Viral Installer code for your widget? Let’s walk through a simple example.

1. Create a page on a non-Widgetbox website that will allow users to customize and grab your widget. Note the page’s URL. For our example, let’s assume the URL is "http://www.your-site.com/viral-installer-example.html".
2. On Widgetbox.com, create a new hosted widget with a single configuration parameter called RemoteParam1. Of course, you can have multiple config parameters (i.e. RemoteParam2 … RemoteParamN) as necessary. We’ll just keep it simple for now.



3. On the Parameters screen:
• a) Ensure the Display Name and Name for your parameter are called RemoteParam1. Change the parameter type to "Hidden".
• b) Click the wrench icon associated with RemoteParam1. Provide a Default Value of "Text to Support Widget Preview". This value will be used to support the widget preview users see in the Widgetbox Gallery.
• c) Check the "Use remote configuration" checkbox and enter the URL to the page you identified in step 1.



Note: You could click the Get the Viral Installer link to get the Viral Installer at this point. But don’t for now - we’ll come back to it later.

4. Accept the default settings on the Preview screen.
5. Finish registering your widget on the Gallery Entry screen and make sure you assign a Permalink ID. For now, don’t submit the widget for consideration to the Widgetbox Gallery. We’ve got a little more work to do



6. Visit My Widgets > Developed Widgets and click your widgets name. You’ll notice your widget’s home page is a little different.
• a) Instead of seeing the Widget Settings panel, users are instructed to visit your site to customize and get your widget.
• b) The Get Widget button is purple instead of green. This lets users that the process of customizing and grabbing the widget will occur on your site.



7. Go back to My Widgets > Developed Widgets. Click the link called Get Installer associated with your widget.



8. Copy the Viral Installer code that appears. It’ll look something like this:
<!-- Developer: you can configure your widget's values via Javascript.
Learn more at http://docs.widgetbox.com/developers/viral-installer/ –>
<form id="viral_installer_example_GetWidgetForm" style="display:none;">
<input type="hidden" name="appInstance.instanceName" value=""/>
<input type="hidden" name="appInstance.width" value=""/>
<input type="hidden" name="appInstance.height" value=""/>
<input type="hidden" name="RemoteParam1" value=""/>
</form>
<script src=’http://www.widgetbox.com/get_widget_btn.jsp?sourceId=<Unique ID Value>&ns=viral_installer_example’></script>

9. Let’s explain the values the hidden field values.

appInstance.instanceName - The "friendly name" a user can assign to a widget.

appInstance.width - The width of the widget.

appInstance.height - The height of the widget.

Note: If no values are provided for these three fields, the widget will be created using values associated with the widget’s preview settings.

RemoteParam1 - The value that maps to ${config.RemoteParam1}

Note: If no value is provided for this field, the default value (if it exists) will be used.

10. Put the Viral Installer code onto the page you identified in steps 1 and 3c.
11. Test the Viral Installer. We’ll do this by temporarily adding values to each of the hidden form fields.
<!-- Developer: you can configure your widget's values via Javascript. Learn more at http://docs.widgetbox.com/developers/viral-installer/ -->
<form id="viral_installer_example_GetWidgetForm" style="display:none;">
<input type="hidden" name="appInstance.instanceName" value="My Customized Viral Installer Widget"/>
<input type="hidden" name="appInstance.width" value="200"/>
<input type="hidden" name="appInstance.height" value="200"/>
<input type="hidden" name="RemoteParam1" value="Viral Installer Test"/>
</form>
<script src=’http://www.widgetbox.com/get_widget_btn.jsp?sourceId=<Unique ID Value>&ns=viral_installer_example’></script>
12. Save your page. Load it in your browser.
13. Click the Get Widget link. The same menu that appears on the Widgetbox.com site when a user clicks Get Widget will appear. Pick a site to install your widget or just grab the widget code.
14. Take a look at your installed widget. The text "Viral Installer Test" should appear within.
15. Remove the temporary changes to the widget code made in step 10. Save the changes. Reload the page in your browser.
16. What’s next? Build an interface to feed values into the hidden form. What does does the interface need to look like? That’s up to you! If you want a quick solution, you can un-hide the Viral Installer form and each of the form input fields.
17. Don’t forget to come back to Widgetbox and submit your widget for consideration in our Gallery.

Get the Viral Installer

We may decline to include and display widgets that violate our program guidelines, including:

• Illegal content
• Invasions of personal privacy
• Pornography or obscenity
• Content that interferes with the functioning of the sites the widget is embedded into
• Promotions of hate or incitement of violence
• Violations of copyright
• Widgets that aren’t actually widgets. Meaning, the content of the widget has to be an actual widget that people would put on a site. It can’t be an ad for widgets that live elsewhere. It can’t be a widget plus its installation instructions.
• Any un-altered copy of the “Hello World” example HTML/JS widget provided to you by Widgetbox.

In addition, if the widget seems broken or incomplete or otherwise unusable, we will reject it and ask you to fix the issues.

You can see the full Developer Agreement at http://www.widgetbox.com/info/legal/developer-agreement/.

These policies may be revised from time to time without notice.

Table of Contents

Making and Distributing Your Widget

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

Types of Widgets

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

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.

• Remote 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.