Wiki source code of Icon Theme Properties
Last modified by Eleni Cojocariu on 2026/08/26 12:25
Show last authors
| author | version | line-number | content |
|---|---|---|---|
| 1 | The content of an [[Icon Theme>>doc:documentation.xs.admin.icons.icon-themes.WebHome]] page is a properties file: one ##key = value## per line, the settings below and the icon mappings in any order. Every value is evaluated as Velocity, with ##$icon## holding the name being drawn, unless it takes [[one of the shapes that are substituted directly>>doc:documentation.xs.dev.icons.WebHome||anchor="HHowthemevaluesarerendered"]]. | ||
| 2 | |||
| 3 | |=Property|=Optional|=Description | ||
| 4 | |##xwiki.iconset.type##|no|##image## when each icon is a picture, ##font## when each icon is a glyph selected by CSS classes. | ||
| 5 | |##xwiki.iconset.render.wiki##|no|The XWiki syntax that displays the icon. | ||
| 6 | |##xwiki.iconset.render.html##|no|The HTML that displays the icon, used when the caller asks for HTML directly. | ||
| 7 | |##xwiki.iconset.icon.url##|yes|The URL of the icon's picture, reported as the ##url## metadata. Set it on an ##image## theme. | ||
| 8 | |##xwiki.iconset.icon.cssClass##|yes|The CSS classes that select the icon's glyph, reported as the ##cssClass## metadata. Set it on a ##font## theme. | ||
| 9 | |##xwiki.iconset.css##|yes|The URL of a stylesheet the icons need. Several URLs are separated by commas, so a comma inside a URL has to be written ##%2C##. | ||
| 10 | |##xwiki.iconset.ssx##|yes|The reference of a page holding a Style Sheet Extension the icons need. | ||
| 11 | |##xwiki.iconset.jsx##|yes|The reference of a page holding a JavaScript Extension the icons need. | ||
| 12 | |||
| 13 | None of the three that are not optional has a default: without ##xwiki.iconset.type## a request for an icon's metadata fails, and without the matching ##render## template the icon is drawn as an empty string. | ||
| 14 | |||
| 15 | == Examples == | ||
| 16 | |||
| 17 | The bundled Font Awesome theme, a ##font## theme pulling two stylesheets: | ||
| 18 | |||
| 19 | {{code language="properties"}} | ||
| 20 | xwiki.iconset.type = font | ||
| 21 | xwiki.iconset.css = $services.webjars.url('org.webjars:font-awesome', 'css/all.min.css'),$services.webjars.url('org.webjars:font-awesome', 'css/v4-shims.min.css') | ||
| 22 | xwiki.iconset.render.wiki = {{html clean="false"}}<span class="fa fa-$icon" aria-hidden="true"></span>{{/html}} | ||
| 23 | xwiki.iconset.render.html = <span class="fa fa-$icon" aria-hidden="true"></span> | ||
| 24 | xwiki.iconset.icon.cssClass = fa fa-$icon | ||
| 25 | {{/code}} | ||
| 26 | |||
| 27 | The bundled Silk theme, an ##image## theme: | ||
| 28 | |||
| 29 | {{code language="properties"}} | ||
| 30 | xwiki.iconset.type = image | ||
| 31 | xwiki.iconset.render.wiki = [[image:path:$xwiki.getSkinFile("icons/silk/${icon}.png")||alt="" data-xwiki-lightbox="false"]] | ||
| 32 | xwiki.iconset.render.html = <img src="$xwiki.getSkinFile("icons/silk/${icon}.png")" alt="" data-xwiki-lightbox="false" /> | ||
| 33 | xwiki.iconset.icon.url = $xwiki.getSkinFile("icons/silk/${icon}.png") | ||
| 34 | {{/code}} | ||
| 35 | |||
| 36 | == Icon mappings == | ||
| 37 | |||
| 38 | Every key that is not one of the settings above is read as a mapping from a name of [[the XWiki Icon Set>>doc:documentation.xs.admin.icons.icon-set.WebHome]] to the value the templates substitute for ##$icon##: | ||
| 39 | |||
| 40 | {{code language="properties"}} | ||
| 41 | accept = check | ||
| 42 | add = plus | ||
| 43 | home = house | ||
| 44 | {{/code}} |