In this article, we’re going to look at new feature for Avada 6.2; the option to upload and use custom icons throughout your Avada website. Custom icons add a visual appeal to your website’s content that will engage your audience.

Let’s take a closer look at how this process works. You can also watch a video of the process below.

For privacy reasons YouTube needs your permission to be loaded. For more details, please see our Privacy Policy.
I Accept

Generate Icon Packs via Icomoon

To generate your custom icon sets, we suggest using Icomoon. it is a great resource, with a large library of free and premium icon setsset to choose from.

With over 5,500+ free vector icons to choose from, the variety is seemingly endless. And, you also have the option to upload your own SVGs to make fonts, and you can convert icons to SVG, PDF, Polymer, XAML, CSH.

Icomoon

Selecting icons for your icon set, as many as you may need, is straightforward in the Icomoon App.

Once you have selected the desired icons, you must generate the icon set for import and use with Avada. Each generated icon set must have a unique Font Name and CSS Class Prefix.

Decide on the Icomoon defaults in the preferences section before downloading your custom icon set, as seen below. Clicking download will download the Custom Icon Set as a zip file to your computer.

Chaning Icomoon Name and Class Prefix

Uploading And Managing Your Icon Sets in Avada

Uploading your newly generated icon sets for use in your Avada website is straightforward and fast. All custom icons are uploaded, saved and managed via the Fusion Builder > Icons section of the Avada WordPress Dashboard.

Step 1, click on on Create New Icon Set.

Create New Icon Set

You will be presented with a screen which is where you can upload your newly generated Icomoon icons sets.

Step 2, click on on Select File.

Adding Custom Icon Sets

The ZIP file is uploaded to WordPress Media Library, and all of the icons will load on the Edit Icon Set page. If you ever decide to update an existing icon set, you can reupload the set in this edit screen by selecting Update Custom Icon Set.

Uploaded Icons
IMPORTANT NOTE: When you create a custom icon set in the Fusion Builder, the set will be saved immediately and before the icons are uploaded. As soon as you upload, the set is auto-saved. If you add an Icon set through the Plus button in the Icon Picker or by clicking Add New when on the Edit Icon Set page, the set will be unpublished until you click Publish.

Your Custom Icons Are Ready To Use

Uploaded and ready to go! You can now add custom icons to your content, anywhere, and often as you wish. Use any Design Element that has an icon picker, including the Icon Element. You will see any custom icon sets you have added in their own tab at the top of the icon picker, alongside the free Font Awesome icons.

Icon Element

And that’s it. You can upload as many Custom Icon Sets as you need, and if you need to update them, edit the collection and reupload the icons. With this fantastic new tool, you will be able to add a bespoke signature to any website you design and build with Avada.