Tutorial : How to Put Icons on Your Website

by

Here’s the easiest method to insert icons on 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:

See how to use it with your navigation menu bar:

how to use icons and put in your navigation bar

Here’s the method:

<link rel="stylesheet" href="/fontawesome-free/c33 /all.min.css">
<link rel="stylesheet" href="/fontawesome/4.7.0/c33/fontawesome.min" />
</head> <body>
</body> </html>
  • 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.
<div class="navbar">
<a class="active" href="#"><i class="fas fa-home"</i> Home</a>
<a href="#"<i> class="fa fasearch"</i> Search</a>
<a href="#"<i> class="fa faenvelope"></i> Contact</a> </div>
  • Call them on your headers using these codes. 

Leave a Comment