Tutorial : How to Put Icons on Your Website

| Written by: james


Table of Contents:

    The easiest way to put icons to your website

    Here's an easy way to put icons on your website or apps. Website icons are called glympicons. Make your website more attractive and looking alive to your users with the help of these cool icons.

    Want these icons on your webiste? See image:

    how to put icons on my website easily tutorial

    See how to use it with your navigation menu bar:

    how to use icons and put in your navigation bar

    Here's the method:

    • First go to FontAwesome.com and download the fontawesome for web.
    • After the download go to your website root folder and extract the content which are the css and webfonts folder. If you already have a css folder then just copy all the content of the fontawesome css's folder.
    • Now on your source code on whichever file you want to show the icons on your website say on this example is the index.php file. You want to show the icons right beside of your menu items just like the image above.
    • Call them on your headers using these codes. 

    • Now, whenever you want to show the icons simply follow this code style:

    • You see how I use <i class="fab fa-accessible-icon"></i> This is how you show the icon beside of the Home menu.

    How to use the right icon or how to find the right icon to use?

    Simply go to FontAwesome.com website and search for the right icon you want to use. Everything on their can be easily called using the code I have mentioned above. Like this image below:

    how to use fontawesome icons

    Author: james
    Created Date: May 30, 2020
    Updated Date: May 30, 2020