Drupal Bootstrap – 27 – Adding icons – Glyphicon/Font awesome – PART I

Drupal Bootstrap – 27 – Adding icons – Glyphicon/Font awesome – PART I

NOTE:
If you are using Bootstrap theme 3.x (3.1 and above), please use following css to distance the menu from the icon. The icon is using the SPAN tag instead of i tag now. Take note.

.navbar-nav span

————————
In this tutorial, we will learn on how to add icons (Glyphicon/Font awesome) to the Menu and Block using modules.

Playlist: https://goo.gl/47TkI6

Modules to install:
https://www.drupal.org/project/icon
https://www.drupal.org/project/fontawesome

Other nice tutorials you may refer:
http://www.webwash.net/node/238

“““““““““““““““““““““““““““““““““““““`
For Drupal 8, the “Icon API” module is not yet ready, but you can add fontawesome icon to your menu link using the following modules:

https://www.drupal.org/project/fontawesome
https://www.drupal.org/project/fontawesome_menu_icons

For “Font Awesome Menu Icons” to work, you will have to download “Font Awesome Icon Picker” and place it in /libraries/fontawesome-iconpicker. However, the provided download link no longer valid, you can download from the following link I found instead.

https://github.com/farbelous/bootstrap-popover-picker

Tutorial from OSTraining you can refer to:
Here the tutorial for D8:
https://www.ostraining.com/blog/drupal/fontawesome-icons-in-menus