> For the complete documentation index, see [llms.txt](https://documentation.connexica.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://documentation.connexica.com/legacy-wiki/icon-picker.md).

# Icon Picker

The Icon Picker is a jQuery plugin written by XWiki to help users select an icon. See [IconPickerMacro](broken://pages/9924aa48c1bb4ed3b41a0bf43b2119a0b1015e6a) for using this picker easily. If you want to use it manually, read the following.

## Example

With Velocity and HTML:

```none
// Enable the CSS of the picker:
\#set(\$discard = \$xwiki.ssx.use('IconThemesCode.IconPicker'))

// JavaScript code:
<script>

// Configure requirejs to load the picker code
require.config({
  paths: {
    'xwiki-icon-picker': '\$xwiki.getURL($services.model.createDocumentReference('', 'IconThemesCode', 'IconPicker'), 'jsx', "minify=$!request.minify")'
  }
});

// Require jquery and the icon picker
require(['jquery', 'xwiki-icon-picker'], function($) {
  // Here you can bind the picker to some elements.
  // Examples:
  $('#someElement').xwikiIconPicker(); // apply the picker to the field #someElement
  $('#someElement').xwikiIconPicker({prefix: 'image:icon:'}); // change the prefix inserted before the icon name
});

</script>
```