Adding Custom Icons
Last updated
Last updated
The Custom Icons tab in WP Dashboard allows you to add your own Custom Icon Fonts. This feature is supported by a free Custom Elementor Icons plugin preinstalled with the theme.
Important!
Since version 5.0.9 we have removed the Custom Icons by StylemixThemes plugin from the theme package and replaced it with Custom Elementor Icons plugin.
You need to uninstall the Custom Icons by StylemixThemes plugin for everything to work correctly.
Icon Fonts can be generated through icomoon.io website, where you can convert your own SVG files to Font format, or you can create Icon Font from any icons in the icomoon.io library. We will discuss both options below.
You can upload your SVG icons to convert them to the icon font format. Go to the icomoon.io website library and click the "Import Icons" button:
Choose the SVG icons from your computer and insert them into your library:
You will see the uploaded SVG icons to convert them to the icon fonts:
Select the icons you want to convert and click the "Generate Font" button below:
All your icons will be listed for a check:
If you want you can change the default settings of the icon set by clicking the settings icon:
In the icon settings, you will write the unique name of the set and the class prefix/suffix:
NOTE: To write a unique class prefix is important because the icon name should not conflict with other well-spread icon sets.
Then click the "Download" button to download your icon font set:
Go to the icomoon.io website library and click the "Add Icons From Library" button to generate the external icon fonts. It is very useful when you do not have your own icon fonts:
Choose any icon set from that library and click the "Add" button:
In the chosen Icon set, you can further select icons and make your own Icon set:
In the next step, you will be referenced with your icons in details:
If you want to change the default settings as icon set name, prefix, suffix, you should click the settings icon. Then click the "Download" button to download your icon font set:
After activating the Motors Theme, you will see a default icon set uploaded in Custom Icons tab. You can upload any icon fonts by clicking the Upload New Icons button above:
After generating Icon Fonts in icomoon.io, you can upload your icons in the format of an archive file to your website. You can upload Icon Fonts from your WordPress Media Library if it is uploaded before or from your Computer directory. Click the "Select files" button to upload your icon fonts. Your Icon Fonts folder should be in a zip file:
After choosing the proper file, you will get the success message of reloading it. Then, below the success message, you can see your icon set to insert them into any pages or posts:
Important!
The Icon Fonts folder should have an appropriate structure containing all necessary files. If the structure is not correct, you will get the error message of uploading icons.
To check the icon folder structure, you need to extract that folder:
The icons folder should have the following structure:
If you do not have selection.json or style.css or another important file, you will get the above error message after uploading it.
To overcome this issue, you need to retry generating icon fonts, following the rules explained above.
You can upload more than one Icon Font Sets. As an example above, you need to upload other Icon Folders and you will have several sets:
If you want to delete the Icon set, you can click the "Delete Icon Set" button and the set will be deleted: