Icon sets and collections

Create one icon set per client or brand, fill it with icons, organize it in the Icon library grid, and use theme and folder icons as collections.

With Easy SVG Pro you can keep as many icon collections as you need, for example one per client or brand. This guide shows how to create an icon set, fill it, organize it, and how icons from your theme or from folders join in as collections too.

Before you start

Your Pro license is active.
Icon set editor is on under Icons → Features.
For the WordPress Icon block: Multiple collections is on too, and the site runs WordPress 7.1 or newer.

Collections, sets and folders

A collection is any named group of icons. Pro knows several kinds, and they all appear side by side in the Icon library grid:

Kind	Made by	Can you edit it here?
Icon library	The free plugin	Yes
Icon set	You, in WordPress	Yes
Theme icons	SVG files in your theme's `assets/icons` folder	No, edit the files
Icon folder	SVG files in `wp-content/easy-svg-icons/<name>/` or an icon pack plugin	No, edit the files
Registered by code	A developer, with a few lines of PHP	No

Example: an agency builds sites for a bakery and a law firm. It creates two sets, bakery and lawfirm, so each client's icons stay apart and are easy to find.

Create your first set

Start a new set

Go to Icons → Icon sets and click New set. You are taken to the Icon library tab. You can also click New set directly in the Collections list on the left of the Icon library.

Name it

Type a name into Name of the new set, for example "Acme", and press Enter. A message says "Set "Acme" made. Drag icons onto it." The set appears in the Collections list.

Open the set

Click the set in the Collections list. The grid now shows only that set, and the drop area at the top adds icons to it.

Add icons

Drop SVG files on the drop area, or click Choose an SVG, Choose from the media library or Paste markup. A ZIP of SVG files or an SVG icon font works too, see Import icons.

Your set is ready. Each icon now has an address like acme/front-door, and you can use it in the Icon block, with the shortcode, with easy_svg_icon() or in your page builder.

Organize your icons

Everything happens in Icons → Icon library. The Collections list on the left switches between All icons, the Icon library and each set or folder. A folder is marked "Read only: these icons come from files".

You want to...	How
Move an icon into a set	Drag its tile onto the set in the Collections list, or open the tile's More menu and pick the set under Move to.
Move many icons	Click Select several, tick the icons, then Move to… in the dark bar.
Rename an icon	Pencil button on the tile. The address stays.
Give an icon a new drawing	More menu → Replace the drawing…, then pick a file. The address stays.
Make an icon follow the text color	More menu → Recolor: take the text color. Every fill and stroke becomes `currentColor`.
Download icons	Select several, tick up to 100 icons, then Export. You get one ZIP pack.
Rename a set	Click the set's actions button in the Collections list → Rename. Its address stays.
Delete a set	Set actions → Move to trash. Undo brings it back.
Remove icons from a set	Select several, tick them, Remove. Undo brings them back.

Moving an icon to another set changes its address, for example from acme/door to lawfirm/door. Pro updates the places it can find (posts, fields, builder data) and tells you how many it updated. Templates in theme files must be changed by hand.

The Icon sets screen

Icons → Icon sets is a list of all your sets with their Name, Address and number of Icons. Use it to search sets, select several and Move to trash in one go. A set in the trash is no longer offered to the Icon block. WordPress empties the trash on its own schedule.

Icons from your theme and from folders

With Theme & folder sources switched on, Pro also reads SVG files from folders. No upload is needed: put the files in place and they appear as a collection.

Your theme. SVG files in your theme's assets/icons folder become the collection Theme icons. A child theme's files win over the parent theme's files of the same name.
A drop-in folder. Create wp-content/easy-svg-icons/acme/ and put SVG files in it. They become a collection named after the folder, or after the slug in a manifest.json in that folder.
An icon pack plugin. A plugin built with the Icon Pack Starter hands its folder to Pro.

Each file becomes one icon, named after the file: front-door.svg becomes front-door. Folder icons are read-only in WordPress. To change one, change the file.

Go to Icons → Packs to see every collection with where it comes from, and the files a folder could not use with the reason.

Good to know

The address is the identity. Templates, blocks and fields store the address. Renaming an icon or a set never changes it, replacing the drawing never changes it, moving does.
Folders are limited to 1000 icons. Bigger folders are cut short, and the Packs screen says which files were left out. A developer can raise the limit.
Sets in drafts. A set that is not published yet keeps its own editing screen and is not shown in the grid until it is published.

Common questions

Import icons

Fill a set from a ZIP, a font or Font Awesome.

Bulk editing

Rename, copy and move many icons at once.

Icon history

Go back to an earlier drawing.

Icon packs

Move a set to another site.

Developers can register a collection in code, see Register a collection, and find everything else in the developer reference.

Was this page helpful?