Want to use Custom Icons in Avada? Here’s how to do it!

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.

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.

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.

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.

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.

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 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.

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.