If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)

captcha

Featured templates

CherryFramework 4. How to change Flaticon icons

This tutorial shows how to change Flaticon icons in CherryFramework 4 templates.

CherryFramework 4. How to change Flaticon icons

To change Flaticons, you should do the following:

  1. Log into your WorpPress admin panel.

  2. Inspect the icon using Mozilla Firefox add-on Firebug or any other developer tool.

  3. Locate icons stylesheet and open it in a new tab. In our case it is flaticon.css file, located in wp-content/themes/themeXXXX/assets/fonts folder (where XXXX stands for theme number):

    CherryFramework_4.How_to_change_Flaticon_icons_1

  4. Open this file in a new tab to locate “Source” for your icons. In our case it is http://www.flaticon.com/packs/chapps. Open this link in a new tab and press Download pack button on the right side:

    CherryFramework_4.How_to_change_Flaticon_icons_2

    CherryFramework_4.How_to_change_Flaticon_icons_3

  5. Once the pack is downloaded, please unzip it and navigate to png folder, to get the icon class, you should just copy its file name:

    CherryFramework_4.How_to_change_Flaticon_icons_4

  6. Go to your dashboard. Navigate to edit the post that uses Flaticon icon. In our case this is services type post, located under Services-> Services tab and select the post to edit.

  7. Scroll down to find the field Font icon CSS class and change the icon class:

    CherryFramework_4.How_to_change_Flaticon_icons_5

  8. Save changes and check your website, the icon was changed successfully! In order to add an icon, just specify it in caption field for the needed article in the similar way, please.

  9. Save settings using Update button.

Feel free to check the detailed video tutorial below:

CherryFramework 4. How to change Flaticon icons