Skin Extension Tutorial

Last modified by Eleni Cojocariu on 2026/10/02 10:57

This tutorial has moved into the XWiki documentation, under Skin Extensions, which splits it across a hub, two reference pages and three How-tos. Every heading of the original is kept below, each pointing at the page that now carries its material, so that existing links and bookmarks still resolve.

Prerequisites

Moved to Create a Skin Extension.

Introduction to XWiki Skin Extensions

Moved to Skin Extensions.

My first Skin extension

Moved to Create a Skin Extension.

Minimal JavaScript extension

Moved to Create a Skin Extension.

Creating an extension object

Moved to Create a Skin Extension.

Writing the extension

Moved to Create a Skin Extension, and to Skin Extension Object Fields for what each field of the object decides.

Testing the actual extension

Moved to Create a Skin Extension.

Minimal StyleSheet extension

Moved to Create a Skin Extension.

Put all together

Moved to Create a Skin Extension, and to Skin Extension Object Fields for the rights an extension needs.

Real-world extension with addSizes.js

Dropped. The walkthrough built on an external file size service that no longer answers, which the tutorial's own warning already said. The techniques it demonstrated are on Generate Skin Extension Content with Velocity.

Requesting and injecting files size with JSX

Dropped with the addSizes.js walkthrough. The walkthrough built on an external file size service that no longer answers, which the tutorial's own warning already said. The techniques it demonstrated are on Generate Skin Extension Content with Velocity.

Making it look nice with SSX

The addSizes.js scenario is dropped, but the technique it showed is on Generate Skin Extension Content with Velocity.

Testing the final extension

Dropped with the addSizes.js walkthrough. The walkthrough built on an external file size service that no longer answers, which the tutorial's own warning already said. The techniques it demonstrated are on Generate Skin Extension Content with Velocity.

Bonus: links to activate/deactivate the extension

Dropped with the addSizes.js walkthrough. The walkthrough built on an external file size service that no longer answers, which the tutorial's own warning already said. The techniques it demonstrated are on Generate Skin Extension Content with Velocity.

Additional Details

Moved to Generate Skin Extension Content with Velocity.

How to use Velocity in parsed content

Moved to Generate Skin Extension Content with Velocity.

How to communicate data to JSX or SSX?

Moved to Generate Skin Extension Content with Velocity.

How to communicate data to JSX

Moved to Generate Skin Extension Content with Velocity.

How to communicate data to SSX

Moved to Generate Skin Extension Content with Velocity.

LESS

Moved to Write a Style Sheet Extension in LESS.

References

Dropped. The new pages put each link where it is relevant instead of collecting them at the end.

Get Connected