How to Add My Own Custom Icon Pack?
Note: in Elementor’s version of TheGem theme you don’t need to add any new custom icon packs. You can just insert SVG icons in any element, where icons can be used. The following explanations cover TheGem WPBakery theme version.
TheGem comes with three powerful icon packs (material design icons, font awesome and elegant icons), resulting in more than 2.500 icons in total. However, you have always an option to add additional icon pack – your own. To do this, you need to use the child theme „TheGem_child_user_icons“, included in theme. Proceed as follows:
Step 1: Install child theme
Install and activate „TheGem_child_user_icons“ child theme, included in theme’s main package. For installation instruction please refer to chapter „How to install the child theme?"
Step 2: Create your own icon pack.
You can use any online service, allowing to create icon fonts, for example https://icomoon.io/app/#/select
1. Create your own icon package. For details on how to do this pls refer to icomoon’s documentation here https://icomoon.io/#docs
2. After you are done with preparing your icon package, click on „Generate Font“
Optionally you can reset the numeration of the icons in your package to make it serially numbered
3. IMPORTANT: In the settings of the icon package you need to definee the Font Name as „UserPack“
4. After that, click on „Download“ to download the zip archive with your icon fonts „UserPack“. Unzip after downloading in a separate folder to get corresponding woff, svg, ttf, oet font files
5. Upload the unzipped woff, svg, ttf, oet files via FTP to the child theme’s folder „fonts/UserPack“ You will find this folder in the child theme „TheGem_child_user_icons“, which you have installed and activated in Step 1.
After you are done, you will get an additional icon pack „UserPack“ in the select box for selecting icon packs:
