Font Awesome

The official way to use Font Awesome Free or Pro icons on your WordPress site, brought to you by the Font Awesome team.

Features

Our official plugin makes it easy to add Font Awesome icons to your pages, posts, and templates and includes the following features:

• Use Pro or Free icons, from the latest release or a specific release.
• Use custom icons from your Pro Kits.
• Use a Font Awesome Kit to add any of our icons (including the latest Duotone styles and custom icons!), or select the Font Awesome CDN for Version 5 icons only.
• Turn on automatic compatibility for Font Awesome Version 4 if you – or your plugins – are still using Version 4 syntax.
• Troubleshoot and resolve issues when multiple versions of Font Awesome are loading on your site from other plugins/themes, which can cause unexpected icon display or technical issues.

How to Use

Install And Enable The Plugin
(See the Installation tab for details)

How to Add and Style Icons
Full docs on how to use the plugin and add icons are available on the Font Awesome Docs site.

Add Icons in the Block Editor
Once you’ve set up your plugin, you can add icons as blocks or inline with text.

To add icons as blocks, select the “Font Awesome Icon” block, and then click the “Choose Icon button” to open the Icon Chooser.

To add icons inline, select the Font Awesome option in the format toolbar to open the Icon Chooser. (Note: Inline icons require at least WP 6.3.)

Once you open the Icon Chooser, add icons by:

1. Searching for the icon you want – you can search by icon name, category, or keyword.
2. Changing the Family and Style using the drop downs if you want an icon in a different style.
3. When you see the icon you want, clicking it to enter it into the content of your page or post.

Note: If you want to search and add Pro icons in the Icon Chooser, make sure you set your plugin to use a Pro Kit.

Add Icons in The Classic Editor
If you need to add icons in the classic editor, you can use the icon names in shortcodes or HTML. Add an icon using shortcodes to any text area – just add the name of the icon and a style prefix, where the prefix is the style of icon you want to use. Note that you don’t need to include the fa- part of the icon name. And if you don’t include any style prefix, the icon will default to the Classic Solid style.

The shortcode for an icon looks like this:

[icon name="stroopwafel"]

[icon name="stroopwafel" prefix="fa-sharp fa-light"]

Read the full description on the official page →