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

Featured templates

Drupal 7.x. How to change Font Awesome icons

This video tutorial will show you how to change Font Awesome icons in Drupal 7.x.

Drupal 7.x. How to change Font Awesome icons

  1. Inspect the element with Firebug, you will see: <span class="fa fa-user"></span> :

    Drupal_How_to_change_Awesome_Font_Icons-1

  2. Using Total Commander or any software that has "find text" feature, locate the file with the required code:

    Drupal_How_to_change_Awesome_Font_Icons-2-2

  3. Open font-awesome.css loaded on your page (you can find the link to it in page source code):

    Drupal_How_to_change_Awesome_Font_Icons-3

  4. Check the font awesome version in that file:

    Drupal_How_to_change_Awesome_Font_Icons-4

  5. Go to Font Awesome website, locate the cheatsheet for the required font version:

    Drupal_How_to_change_Awesome_Font_Icons-5

  6. Located the needed icon CSS class:

    Drupal_How_to_change_Awesome_Font_Icons-6

  7. Change that CSS class in the file found on the step 2:

    Drupal_How_to_change_Awesome_Font_Icons-7

  8. Refresh the page to see the change:

    Drupal_How_to_change_Awesome_Font_Icons-8

Feel free to check the detailed video tutorial below:

Drupal 7.x. How to change Font Awesome icons