- Web Templates
- E-commerce Templates
- CMS und Blog Templates
- Facebook Templates
- Website-Builder
WordPress. Wie ersetzt man FontAwesome Icons durch Bilder
November 1, 2014
Das jeweilge Tutorial zeigt, wie ersetzt man FontAwesome Icons durch Bilder.
WordPress. Wie ersetzt man FontAwesome Icons durch Bilder
-
Loggen Sie sich ins Control Panel WordPress ein:
-
Gehen Sie ins Menü ‘Medien’ (‘Media’), klicken Sie ‘Neu hinzufügen’ (‘Add New’), um ein Bild hinzuzufügen:
-
Laden Sie das Bild hoch, dann klicken Sie ‘bearbeiten’ (‘edit’), um den direkten Link zu diesem Bild zu erhalten:
-
Kopieren Sie den Link zum Bild:
-
Überprüfen Sie das Icon mit Hilfe von der Firebug Anwendung (Sie können auch das Tutorial nutzen, das Ihnen zeigt, wie nutzt man Firebug Anwendung). Sie werden solche CSS Regel sehen:
.icon-star:before { content: "?"; }
-
Bearbeiten Sie diese Regel wie folgt:
.icon-star:before { content: url("http://template-test.com/elina/wordpress/wp-content/uploads/2014/09/icons_star1.gif") !important;}
wo "http://template-test.com/elina/wordpress/wp-content/uploads/2014/09/icons_star1.gif" ist der direkte Link zum hochgeladenen Bild und !important ermöglicht die alte Regel zu überschreiben. Kopieren Sie die bearbeitete CSS Regel:
-
Im Control Panel gehen Sie ins Menü Design -> Editor (Appearance -> Editor). Öffnen Sie die Datei ‘style.css’ des verwendeten Themas. Fügen Sie die kopierte Regel am Ende der Datei ‘style.css’ ein. Drücken Sie den Button "Datei aktualisieren" ("Update File"):
-
Aktualisieren Sie die Seite Ihrer Webseite. Jetzt können Sie Ihr Bild anstatt des FontAwesome Icons sehen:
Sie können auch das ausführliche Video-Tutorial nutzen: