Читать книгу Professional WordPress Plugin Development - Brad Williams - Страница 108

WordPress features its own open source font icon library called Dashicons. These icons (or dashicons) are used throughout the WordPress Dashboard and are available to use easily in your plugins.

As an example, let's add some fun dashicons to your various plugin headers.

<h1><span class="dashicons dashicons-smiley"></span> My Plugin</h1> <h2><span class="dashicons dashicons-visibility"></span> My Plugin</h2> <h3><span class="dashicons dashicons-universal-access"></span> My Plugin</h3> <h4><span class="dashicons dashicons-buddicons-replies"></span> My Plugin</h4> <h5><span class="dashicons dashicons-businesswoman"></span> My Plugins</h5> <h6><span class="dashicons dashicons-thumbs-up"></span> My Plugin</h6>

You simply add a custom dashicons class to your <span> tag to identify the dashicon you'd like to display. In this example you're using a span tag, but they can be added to additional HTML tags as well, such as a paragraph tag. The preceding code generates the icons shown in Figure 3‐9.

FIGURE 3‐9: Dashicons

It's important to note that dashicons are automatically loaded within the WordPress Dashboard, but not on the frontend of the website. If you'd like to use dashicons on the public side, you'll need to enqueue the dashicon script, as shown here:

<?php add_action( 'wp_enqueue_scripts', 'pdev_load_dashicons_front_end' ); function pdev_load_dashicons_front_end() { wp_enqueue_style( 'dashicons' ); } ?>

Now your plugin has a clean header and uses the Plug icon.

For more information and a complete list of all Dashicons available, see the official resource at https://developer.wordpress.org/resource/dashicons.