WordPress: eigene Dashicons verwenden

Seit WordPress Version 3.8 gibt die Möglichkeit Dashicons im Frontend verwenden, und zwar ca. 200 Icons als SVG (bzw. Webfont).
Der Vorteil: Man spart sich ein meistens gewichtiger Plug-in und braucht keine zusätzliche Webfonts.
Natürlich erfüllen diese Dashicons niemals alle Wünsche: sobald es spezifischer geht. Wie das geht, ganz einfach!
Wordpress-nuetzliche funktion

Folgende Code Snippet in eure functions.php des Themes einfügen:

// Die CSS Datei Dashicons im Frontend  laden
/*--------------------------------------------------------*/
function include_dashicons_font(){ 
wp_enqueue_style('dashicons'); } 
add_action( 'wp_enqueue_scripts', 'include_dashicons_font', 100 );

WordPress Dashicons nutzen

Um die Icons einzufügen benötigt man Icon Klassenbezeichnung, Dashicons findet ihr hier!

wordpress-dashicons

dashicons-admin-toolsergibt dieses Icon aus.


Die Größe wird dabei mit der font-size CSS-Anweisung gesteuert und wird dann so verwendet.

Größe und beliebte WebFont-Farbe wird dann so verwendet.

Fazit:

Ich finde diese WordPress eigene Funktion sehr nützlich, vor allem wenn es um (nicht eigene) Fotos/Bilder Verwendung geht, als gute Alternative sein Artikel etwas Interessanter zu gestalten.

Grüße Viktor

Über den Autor

Viktor37

Ich mache keine Schreibfehler – Ich Tippe Dialekt!!!!
„ich bin nicht System-Administrator weil ich mich so gut auskenne – ich bin nur der, der die meiste Geduld hat Fehlermeldungen zu googeln.“

7 Kommentare

  • Danke für den tollen Tipp mit den Dashicons! Werde die jetzt defintiv auch einmal in meinen Artikeln ausprobieren, die machen ja schon optisch echt was her :-)

  • Hey,
    danke für den Beitrag, ich glaube ich werde es bei mir auch so einbauen. Aktuell nutze ich das Iconset zwar, jedoch nutze ich es mittels einem Plugin über welches ich gleich noch die FontAwesome Icons dabei habe. Ursprünglich hatte ich mich für das Plugin entschieden, da ich mittels Icons Shortcode einbinden kann. Zum Beispiel auch in der Menüzeile: monomentals.com Vielleicht steh ich gerade etwas auf dem Schlauch, wäre das auch mit deiner Variante oben möglich ?

    Gruß und einen Guten Start in den Tag ,
    Phil

  • Klasse Tipp! Wenn ich mal keine Lust habe, Artikel zu schreiben, surfe ich gerne durch die Gegend und schaue, was es so über WP zu lernen gibt. Hab ich gleich mal ausprobiert. Icons kann man immer mal wieder gebrauchen! Danke schön!

  • Gut zu wissen, dass es da jetzt eine simplere Möglichkeit gibt. Werde es bald testen. Ist es vergleichbar mit den icons von „fonts awesome“? Damit hatte ich nämlich nur Probleme.

  • Sehr schön,
    mal wieder etwas neues gelernt! Werde ich demnächst sicher ausprobieren auf meiner Seite. Damit optisch mal was vorangeht
    Lieben Dank,
    Nina

  • Danke für den tollen Tipp mit den Dashicons! Werde die jetzt defintiv auch einmal in meinen Artikeln ausprobieren, die machen ja schon optisch echt was her :-)

Copyright © 2010 - 2017 You-Big-Blog.com