Create, edit and manage skins in XWiki.

Description

How to use it

1. Go to the Administration, in the "Presentation" section:

     

2. Enter the name of the skin to edit (by default: XWiki.DefaultSkin).
3. Click on "Customize".
4. You will get the skin edition page:

     

5. Here you can set the name of the skin, the parent of the skin (base skin) and you can change the logo. (The logo could be overrided by the Flamingo Theme Application).

Templates customization

Principle

A skin is made of templates written in Velocity (*.vm files), JavaScript (*.js files), CSS and LESS. Each XWiki action is bound to a template, organized like this:

Inside a template, you can include an other template, so that you can split your skin in different files. The syntax is:

In XWiki, there is two types of skins:

• the file system skins, which are made of template files directly stored in the webapp folder
• the wiki skins, which are made of templates stored in the wiki.

The main skins (Flamingo, Colibri) are stored in the file system, so they can be used even when the database is empty. It is a logical choice for default skins.

The user skins are usually stored in the wiki (so in the database). They are based on existing skins but they just override some templates. They are also easier to install, since you just need to import a XAR or to install the skin with the Extension Manager.

How to override a template

There is 2 ways to override a template (+ a deprecated one):

1. By adding an overrided template object
2. By adding an attachment to the skin

Adding an overrided template object

1. Go to the "Overrided templates" section:
2. Enter the name of the template that you want to override (eg: view.vm, footer.vm, style.css, etc...). If the template is stored inside a directory, you can use the "/" character as separator (eg: less/style.less.vm, less/headers.less).
3. Click the "add" button:

     

4. Here you can write the content of the template. We usually take the content of the existing template from the parent skin (by browsing the http://localhost:8080/xwiki/skins/flamingo/footer.vm URL) and we add some customization in it:

     

5. Save the skin

It's done, you have introduce an overrided template.

Adding an attachment

For resources files (images, fonts, etc) or for big templates, you can add the template as an attachment of the skin.

More informations about this.

The deprecated way

For retro-compatibility reason, we have introduced a "deprecated properties" section. In there, you can override some templates. See the documentation of this mechanism.