Good use of icons on a website can really lift its overall design. Of course, you can't just slap them on and expect a site to look brilliant. It's all about choosing the right type of icons to match the design.

Once your designer has chosen a font library like Font Awesome, or made their own, what is the best way of displaying them in Drupal? The quick and simple way is to get the designer to style them using CSS but this is not flexible.

What if an editor wants to choose which icon is displayed in a menu? If you've added them to the menu manually via CSS then the editor won't have the ability to change the icon in the future.

The Icon API module integrates common icon bundles like Font Awesome, Bootstrap and more within Drupal. The module offers integration with a suite of sub-modules. For example, if you want to add icons to menus then install the icon_menu module.

In this tutorial, we'll configure Icon API to allow an editor to add icons to menus and directly into content. We'll do this using the Font Awesome icon bundle.