How To : Embed a Live Widget onto Your Web Page

How To... Embed a Live Widget onto Your Web Page

This document includes instructions and code that will display a live widget when placed on your web page. This document is designed to outline, in detail, the steps required to deploy a live Widget onto your Web page, and, in addition, enabling it by doing so to be deployed instantly to a user's SpringBox desktop application.

1. Get Your Member ID

If you are NOT part of an affiliate program, skip this step.

If you are part of the affiliate program (custom installers and branding, packaged widgets), then you must first acquire your Member ID. You will need this ID in order to link to the correct download page that will lead the user to your custom branded installer. Member IDs can be requested from support@fimlabs.com.

2. Include the JavaScript File

You must first include a JavaScript file on your web page. This file contains all logic needed for the deployment of one or more Live Widgets on your web page.

Place the following code onto the <head> of your webpage:


3. Write a Wrapper for Your Live Widget

In the <body> of your web page where you wish the widget to reside, place the following code. This code calls a deployment function in the JavaScript file (from Step 1) that will produce the necessary HTML for the widget to run in your web page. There are two(2) variations:

a) Wrapper for a Live Widget:
   You should now be able to see the widget displayed in your webpage. You will notice a blue DOWNLOAD button in the top right corner of the wrapper. Clicking it will lead the user to a page where the SpringBox Application can be downloaded for installation. Please verify that your Member ID was passed to the download page.

If SpringBox is running on the user's computer, you will see a POP button instead of the download button. When clicked, the widget will be deployed directly onto the user's desktop. The widget will now be installed and will be accessible to the user for later use.



printWrapper()

Availability
http://downloads.thespringbox.com/web/wrapper.js

Useage
printWrapper(widgetName:String, parameter:String, width:Number, height:Number, memberId:String);

Parameters
widgetName — A String representing the name of the widget. In order to reference a new widget, the widget file must be submitted to FIMLabs in order to be registered into the system.
parameter — A String supplying parameter(s) that the widget requires to display information. The parameter(s) are defined when the widget is developed.
width — A Number that sets the width of the widget in pixels.
height — A Number that sets the height of the widget in pixels.
memberId — A String representing the affiliate.

Description
Places a live widget in your web page.

Example
printWrapper("RSS Reader","http://www.thespringbox.com/rss/rssreader.xml",300,250,"timesonline");

b) Pop Button for a Widget
 Welcome to TheSpringBox

  A user can click the button to pop the Widget. If the desktop application is not present, the button will be grayed out.



printButton()

Availability
http://downloads.thespringbox.com/web/wrapper.js

Useage
printButton(widgetName:String, parameter:String, memberId:String);

Parameters
widgetName — A String representing the name of the widget. In order to reference a new widget, the widget file must be submitted to FIMLabs in order to be registered into the system.
parameter — A String supplying parameter(s) that the widget requires to display information. The parameter(s) are defined when the widget is developed.
memberId — A String representing the affiliate.

Description
Places a widget button in your web page.

Example
printButton("RSS Reader", "http://www.thespringbox.com/rss/rssreader.xml");

4. Adding a Cross Domain Policy file

See How To... Add a Cross Domain Policy File


See also: