Leave a suggestion

Wenn dieses Tutorial ist nicht genau was Sie suchen und Sie noch Fragen oder Vorschläge haben – lassen Sie uns wissen. Helfen Sie uns bitte um besser zu dienen!

Ihr Name

Emailadresse

Ihre Nachricht (benötigt)

WordPress. Wie redigiert man Icon Fonts Font Awesome

Das jeweilige Tutorial zeigt, wie redigiert man Icon Fonts Font Awesome in der Vorlage WordPress.

WordPress. Wie redigiert man Icon Fonts Font Awesome

1. Gewöhnlich benutzt man Icon Fonts Font Awesome für Menüelemente in Themata WordPress. Bildschirmfoto ansehen.

2. Um Icons zu verändern, drücken Sie die Einlage Appearance (Erscheinungsbild)->Menus (Menü). Vergessen Sie nicht CSS Classes (Klassen СSS) in Screen Options (Einstellungen des Bildschirmes)zu aktivieren.

3. In unserem Fall hat man dem Menüelement die folgende Klasse: color-1 icon-homeangewiesen. Die erste Klasse color-1 definiert die Schriftfarbe, die zweite icon-home – dieses icon. Bildschirmfoto ansehen.

4. Versuchen wir das Icon zu verändern. Gehen Sie das folgende Link über: http://fortawesome.github.io/Font-Awesome/cheatsheet/ Hier gibt es komplette Liste der Icons. Um grundlegendes Icon zu ersetzen, kopieren Sie einfach seine Klasse.

5. Redigieren Sie die Icons genauso, idem Sie Ihre Klasse im Menü vorgeben CSS Class.

6. Erneuern Sie die Startseite und prüfen Sie Ihre Webseite. Wie sehen wir, Icons des Menüs haben sich verändert.

7. Klassenfarbe definiert die Schriftfarbe. Merken Sie sich, dass soclhe Funktion in der Vorlage nicht sein kann. Prüfen Sie Klassenfarben in allen übergeordneten Menüs. Man kann die gleiche Klasse für ein paar Menüelemente oder für Modifikation der bestehenden Farbe ausnutzen.

8. Um die bestehende Farbe zu verändern, soll man die Schriftfarbe definieren, indem man Plugin für Web-Entwicklung benutzt Firebug. Mehr ausführliche Information darüber, wie man Firebug benutzt, kann man in Tutorial Firebug. Mozilla Firefox pluginfinden.

9. In unserem Fall ist Schriftfarbe in einer Datei angegeben main-style.css.

10. Öffnen Sie eine Datei im Texteditor und finden Sie den notwendigen Code. Wir benutzen Texteditor Notepad++.

11. Kopieren Sie Codezeilen, die man verändern braucht und setzen Sie sie in eine Datei ein style.css sofort nach:

@import url("main-style.css");

Merken Sie sich, dass man alle Veränderungen in der Datei des untergeordneten Themas machen soll style.css (Redigieren Sie nicht direkt main-style.css, weil Sie alle Modifikationen verlieren können, die in dieser Datei gemacht waren).

Veränderte Datei ansehen style.css.

12. Laden Sie die redigierte Datei herunter style.css und erneuern Sie die Webseite (Löschen Sie Cache und cookie des Browsers, wenn die Veränderungen nicht sichtbar sind).

13. Wir haben die Farbe verändert. Bildschirmfoto ansehen.

14. Mehr ausführliche Information über Icon Fonts Font Awesome kann man auf der Webseite finden http://fortawesome.github.io/Font-Awesome/

Sie können auch zum Vorwand ein ausführliches Tutorial Video nehmen:

WordPress. Wie redigiert man Icon Fonts Font Awesome