Skip to content


Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
An example JavaScript widget demonstrating script loading, css reset, and JSONP
branch: master


latest commit 6c573c8625
@jjulian authored
Failed to load latest commit information.
client typo
server capture the url of the site where the widget is installed
README.markdown Initial commit of working example code


Building 3rd Party Widgets with JavaScript

Example code prepared for the Baltimore JavaScript Meetup January 31 2012

This example code will run in a PHP container (Apache). The 'server' dir is the document root. The 'client/index.html' is the reference implementation of the widget, embedded in another site. Open client/index.html in a browser (open the file directly) and interact with the server widget.

Important Concepts

  • the widget loads its own js and css, including jQuery from a CDN
  • cleanslate is used to reset the style of the widget container
  • an anonymous function is used to keep all of the widget code from colliding with client code on the host page
  • JSONP is used to send information back to the server (more sophisticated techniques exist, like CORS or PostMessage)
  • the JSONP destination is actually a PHP script
Something went wrong with that request. Please try again.