Topics

How-To Guides

Resources

Extensions Index
Javadoc
Taglibs
Tools

Icon path to icon class migration

View the index of available developer guides

Jenkins core has removed GIF and PNG icons as of Jenkins v2.333, in favor of the previously added SVG icons.

Plugins, that don’t interact with icons at all, are unaffected by this change.

Examples of area which require changes

  • If a plugin reads icons from its icon path, it typically does the following in jelly:

<img src="${imagesURL}/16x16/fingerprint.png" alt="" height="16" width="16" />
<!-- or -->
<l:task icon="images/24x24/document.png" href="" title="${%Modules}" />

  • or in groovy:

img(width:"16", height:"16", src:"${imagesURL}/16x16/next.gif")

  • A plugin can do that in Java too, but that is, by far, less common.

Maintaining support for legacy icons and modern icons

Jelly offers a couple of properties to access an icon class instead of an icon path. Jenkins core will display a GIF, a PNG or an SVG, based on the Jenkins version used. The properties <l:icon class> and <l:task icon> are used based on the location the icon is displayed in.

Jelly example:

<l:task icon="icon-gear2 icon-md" href="${rootURL}/manage" title="${%Manage Jenkins}" />
<!-- or -->
<l:icon class="icon-gear2 icon-md" />

Groovy example:

l.task(icon:"icon-gear2 icon-md", href:"${rootURL}/manage", title:_("Manage Jenkins"))

More information about Jelly tags provided by core to display icons can be found in it’s jelly documentation.

I still need more help?

Contact the UX sig on Gitter or on the mailing list.