Wordpress

How to add Font Awesome to wordpress functions.php – without a plugin

Font Awesome is a great icon library widely used by developers and designers.
By using the following snippet in your functions.php file , you can include support for font awesome icons in your site.
from there, you can use any icon you want by the HTML.

Why the icons showing as white squares in wordpress?

this is happening, because :

  1. the font Awesome library isnt included in your Theme
  2. you need to update to the latest version (https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css)

For example:
you can show this bookmark icon in HTML

<i class="fa-solid fa-bookmark"></i>

Tip: sometimes if the icons show as a black square⬜ you need to add an extra fa class like this

<i class="fa fa-solid fa-bookmark"></i>
    
//font awesome icons by wpsnippet.club function add_font_awesome_to_header() { echo '<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.2/css/all.min.css">'; } add_action( 'wp_head', 'add_font_awesome_to_header' );

Leave a Reply