By default, Dashicons is not loaded on the front-end of your site.

The Frontend Dashicons plugin loads the Dashicons icon font on the front-end of your site so you can use it in the design of your site.

IMPORTANT: This plugin does not make any shortcodes available to implement Dashicons icons. You can easily use the HTML and CSS options to display icons following the official Dashicons documentation.

Install Elevator

Automatic – WordPress Plugin Repository

1. Login to your WordPress admin.
2. Navigate to the Plugins > Add New screen.
3. Search for ‘Frontend Dashicons’, select Install Now.
4. After successful installation, activate your plugin and begin using Dashicons on the front-end of your site!

Manual – FTP Installation

1. Download the Frontend Dashicons plugin from the WordPress.org to your computer.
2. Unzip the downloaded file.
3. Using your favorite FTP program (such as FileZilla), connect to your website.
4. Upload the entire frontend-dashicons folder to the /wp-content/plugins/ directory.
5. Login to your WordPress admin.
6. Navigate to the Plugins screen, locate the new Frontend Dashicons plugin, activate and begin using Dashicons on the front-end of your site!

FAQs

Why should I use Dashicons on the front-end of my site?

If you only wish to use icons specific to the WordPress admin on the front-end of your site, the Frontend Dashicons plugin is the simplest way to do that.

Why doesn’t this plugin include widgets or Gutenberg blocks to add Dashicons icons?

The goal of this plugin is to provide the simplest and most light-weight solution for loading Dashicons on the front-end of the site. As a result, I made the decision not to bloat the plugin with possibly unwanted widgets and blocks.

Instead, you can easily create re-usable blocks in Gutenberg to add Dashicons icons you use often, or extend the use of Frontend Dashicons by creating your own custom widgets.

Download Frontend Dashicons

You can also contribute to Frontend Dashicons on GitHub.