Applying A Skin

From WidgetAvenue Wiki

Jump to: navigation, search

All widgets created with our API have a skin. If no skin is speicified, a default skin is applied depending on the platform. Here is an example with the "Hello World" widget created previously.

Creating the skin file

Create a skin.html file on your server with the following content: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xml:lang="en">
<head>
<title></title>
</head>
<body>
<div class="ldWidgetTitle" style="display:none;"></div>
<div class="ldWidgetInfo">
<a href="#" class="ldWidgetInfoClose"></a>
<div class="ldWidgetInfoContent"></div>
</div>
<div class="ldWidgetContent"></div><div align ="center"><a href="#" class="ldWidgetPreferences"></a> | <a href="#" class="ldWidgetAnalytics"></a> | <a href="#" class="ldWidgetGet"></a><br/>© <a href="#" class="ldWidgetCopyright"></a></div>
</body></html>

Building the URL to display the standalone version of the widget with the skin

As always, to start with, the most simple option is to display the standalone version of your widget. The URL is built as follows: 

http://www.widgetavenue.com/wdg/loaders/stn.php?root=html&url=[Encoded URL of your source file]&skin=[Name of skin]

For example, if your source HTML file is located at http://myserver.com/HelloWorld.html, and your skin is called myskin.html you will be able to display your widget at 

http://www.widgetavenue.com/wdg/loaders/stn.php?root=html&url=http%3A%2F%2Fmyserver.com%2FHelloWorld.html&skin=myskin.html
Retrieved from "http://www.widgetavenue.com/wiki/Applying_A_Skin"
Personal tools