CSS Requirements
By default, Finesse rewrites the linked CSS in your gadget, which in some cases is not desirable as it results in a loss of functionality if the CSS you are loading refers to other asynchronous elements. As a result, for all third-party gadgets, you can bypass the content rewriting for CSS by including the following in your gadget XML:
-
Add the optional feature "content-rewrite" to disable the CSS rewrite:
<Optional feature="content-rewrite"> <Param name="expires">86400</Param> <Param name="include-url">.*</Param> <Param name="exclude-url">.css</Param> </Optional>
For more information, see Optimizing Gadget Resource Loading.
-
Include UserPref for "externalServerHost":
<UserPref name="externalServerHost"/>
-
To reference the CSS file, perform one of the following:
-
If the gadget is hosted on the Finesse server, reference the CSS file using externalServerHost:
<link rel="stylesheet" href="__UP_externalServerHost__/3rdpartygadget/files/<yourgadgetname>/<path to CSS file>/<CSS filename>.css" type="text/css"/>
where you must update
<yourgadgetname>
to the filename of your gadget under the 3rdpartygadget /files folder and update the remaining path variables to the location of the CSS file for your gadget. -
If the gadget is hosted on a server external to Finesse, reference the CSS file using the URL:
<link rel="stylesheet" href="[https:]//<hostname>/<path to CSS file>/<CSS filename>.css" type="text/css"/>
where you must update the URL variables to the location of the CSS file on your external server, and where specifying the protocol (https ) is optional. (If you omit the protocol, Finesse uses the default protocol of the page.)
-
Note | Finesse Desktop Gadget Container restrains special characters while loading a CSS3 file. See Handling Special Characters in CSS |