Dashicons: Native WordPress-Icons im Theme nutzen

Die Icons im Administrationsbereich von WordPress entstammen seit Version 3.8 einer eigenen Schriftart, die unter GPL lizenziert ist. Die Dashicons lassen sich nicht nur bei der Pluginentwicklung für das Backend, sondern auch im Frontend einsetzen.

functions.php

add_action( 'wp_enqueue_scripts', 'load_dashicons_front_end' );
function load_dashicons_front_end() {
wp_enqueue_style( 'dashicons' );
}

Alternativ kann wp_enqueue_style( 'dashicons' ); in den bereits bestehenden Hook des Themes eingebunden werden.

style.css

Einbinden des WordPress-Logos vor allen Überschriften erster Ebene <h1>.

h1:before {
    content: "\f120";
    display: inline-block;
    -webkit-font-smoothing: antialiased;
    font: normal 1em 'dashicons';
    vertical-align: top;
}

Anmerkung oder Frage schreiben

Jeder Beitrag wird von Hand freigeschaltet. Mit dem Absenden Ihres Kommentars willigen Sie ein, dass der angegebene Name im Zusammenhang mit Ihrem Kommentar und ggf. Ihrer Website gespeichert wird.