Add icons fantastic to your site, and you can also add icons to a blog blogger and coordinate the language of CSS.

I previously showed the best 7 Arabic fonts for the web and websites that you can view, and I also offered a way to add Arabic fonts to the Blogger blog.

In this article, as I said earlier, I will explain the Font Awesome font with which you can add HTML icons, and I will explain how to add it to your website, whether to Blogger or to your WordPress site, and how you can add icons next to the sections in Blogger blog.

How to add the Font Awesome font to your site, the font of social media icons

Adding Font Awesome is the same way as adding any font to websites, importing the font via the Link feature.

Below, I will show you how to add Font Awesome to your site, especially to the Blogger blog.

How to add Font Awesome to your site, install Font Awesome on Blogger blog.

Follow the steps below to add the line:

First, copy the Font Awesome font code as follows.

The link code is like the meta tag; it is placed inside the tag <head>.

Thus, please copy the following code and place it at the Head tag's beginning or end.

 

<link async='async' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css' rel='stylesheet'>

If you want to add the font to Blogger blog, add a tag "/" Post the code before the tag <>directly. Thus the code becomes like this:

 

<link async='async' href='https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css' rel='stylesheet'/>

There are other codes for importing Font Awesome, but the one above is the best of them. Because it is being downloaded from the Cloudflare service and helps increase the website loading speed.

See also: How to Accelerate Blogger Template and Blogger.

You can add the Font Awesome font code <b: skin>directly above the tag as in the Blogger blog's image.


Secondly, copy the code of the icons you want from the Font Awesome website.

Go from here to Font Awesome and search for the icons you want to add to your site.

The icon code you want from the Font Awesome website

After searching, you will see some icons related to the word you entered in the search bar; for example, social media icons will appear.

Choose the icon you want and click on it.

On the page of the icon that you have chosen, copy the icon's code as in the image (HTML code).

The icon code you want from the Font Awesome website

Finally, paste the Font Awesome icon on your HTML page.

Place the icon code in the desired location between the HTML code. For example, this is a code for a pen icon.

 

 <i class="fas fa-pen"></i>

And here, we finish adding Font Awesome, the wonderful font of icons; if you have any questions, put it in the comments box, then.