Steps

Add a skin extension to a wiki page, JavaScript or CSS, using the object editor, which is offered in advanced mode only.

1. Open the page that will hold the extension in the object editor; any page will do, new or existing. In the "New object" list start typing JavaScriptExtension, pick it under "XWiki" and click "Add":

   

2. The page reloads with an empty object. Write in "Code" the JavaScript to run, give the object a "Name" that says what it does, and set "Use this extension" to "On demand only". Leave "Parse content" and "Caching policy" as they are; Skin Extension Object Fields covers both. Save the page:

   

3. A style sheet extension is the same procedure with XWiki.StyleSheetExtension in place of XWiki.JavaScriptExtension, and CSS in "Code", or LESS, which that class alone accepts:

   

4. Pull the extension where it is wanted. Edit such a page in wiki mode and name the page that holds the object, ssx standing in for jsx to pull a style sheet extension; Skin Extension Script API lists the five other pull methods and the parameters they accept:

   {{velocity}}
   #set ($discard = $xwiki.jsx.use('Sandbox.HelloWorld.WebHome'))
   {{/velocity}}

5. An extension that belongs on every page of the wiki is not pulled at all: set "Use this extension" to "On this wiki" instead, a value that comes with a right its page author must have.
6. Open a page that pulls the extension. The JavaScript has run:

   

   The style sheet has restyled the content of the page:

   

   Both arrive in the head element of the response, beside the files of the skin itself. The JavaScript extension above is written there as:

   <script src='/xwiki/bin/jsx/Sandbox/HelloWorld/WebHome?language=en&docVersion=2.1' defer='defer'></script>

   Opening that address returns the code as the browser receives it, minified; minify=false returns it as it was written.

FAQ

Where should the page holding the extension live?

Anywhere the readers of the pages that pull it can view, since that is what decides whether the extension is served at all. Applications keep theirs on hidden pages of a Code space, next to the pages that use them.

Related

• Skin Extensions
• Skin Extension Object Fields
• Skin Extension Script API