Widget structure

This is the basic widget layout. Please change styles and anything within a.entry-widget-launcher, but all class names should stay the same, while the structure (divs etc) should be altered only after discussion.

All style attributes can be edited -- QUESTION: we're probably best not to import a CSS file since it's likely to clash with the host page's CSS and is another file to include... All the CSS magic will be in the iFrame

The 'pretent sidebar' div (div#pretend-sidebar) is just to hold the widget container as if in a page and is not part of the widget.

View the source to see the code.

CSS Classes

Will be used by jQuery etc to manipulate the code

• .tn-pse-widget-container - container wrapper for the whole thing.
• .widget-upper - upper wrapper inside container.
• .view-widget - iFrame within upper section
• .widget-lower - lower wrapper inside container.
• .entry-widget-launcher - <a> tag with image for add button