[contact-form-7 id="24078" title="Feedback EN"]

Featured templates

WordPress. How to change FontAwesome icons (inserted via shortcodes)

Today you will learn more about the font-awesome icons in WordPress Cherry 3.x. templates.

In order to change the icons in your template, you will need to follow the steps mentioned further:

  1. Enter admin panel of your website.
  2. Click on Appearance tab – then Editor.
  3. After that you will be able to see a bunch of different files, out of which you need to find the custom-function.php (In order to make search easier, you can use the CTRL + F function).
  4. When you have opened the file, search for the code that will look as follows:

    if ($icon == 'icon1') {
    $output .= '<div class="extrabox"><figure class="icon"><i class="icon-cogs"></i><span>1</span></figure></div>';
    } elseif ($icon == 'icon2') {
    $output .= '<div class="extrabox"><figure class="icon"><i class="icon-book"></i><span>2</span></figure></div>';
    } elseif ($icon == 'icon3') {
    $output .= '<div class="extrabox"><figure class="icon"><i class="icon-briefcase"></i><span>3</span></figure></div>';
    } elseif  ($icon == 'icon4') {
    $output .= '<div class="extrabox"><figure class="icon"><i class="icon-check"></i><span>4</span></figure></div>';}}

    WordPress. How to change FontAwesome icons (inserted via shortcodes)

  5. In order to change the icon, you need to find and replace the icon class: <i class=”icon-cogs”></i> to the new one.

  6. As an example, let us take <i class=”icon-compass”></i>.

  7. The list of the icons can be taken from here: Font-Awesome Icons

In case you have any issues, feel free to check the video version of our tutorial:

WordPress. How to change FontAwesome icons (inserted via shortcodes)