Categories

Ausgewählte Vorlagen

WordPress. Wie ersetzt man FontAwesome Icons durch Bilder

Elina Webb November 1, 2014
Rating: 5.0/5. From 1 vote.
Please wait...

Das jeweilge Tutorial zeigt, wie ersetzt man FontAwesome Icons durch Bilder.

WordPress. Wie ersetzt man FontAwesome Icons durch Bilder

  1. Loggen Sie sich ins Control Panel WordPress ein:

    Wordpress_How_to_change_an_iconic_icon_with_an_image-1

  2. Gehen Sie ins Menü ‘Medien’ (‘Media’), klicken Sie ‘Neu hinzufügen’ (‘Add New’), um ein Bild hinzuzufügen:

    Wordpress_How_to_change_an_iconic_icon_with_an_image-2

  3. Laden Sie das Bild hoch, dann klicken Sie ‘bearbeiten’ (‘edit’), um den direkten Link zu diesem Bild zu erhalten:

    Wordpress_How_to_change_an_iconic_icon_with_an_image-3

  4. Kopieren Sie den Link zum Bild:

    Wordpress_How_to_change_an_iconic_icon_with_an_image-4

  5. Ü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: "?";
    }

    Wordpress_How_to_change_an_iconic_icon_with_an_image-5

  6. 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:

    Wordpress_How_to_change_an_iconic_icon_with_an_image-6

  7. 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"):

    Wordpress_How_to_change_an_iconic_icon_with_an_image-7

  8. Aktualisieren Sie die Seite Ihrer Webseite. Jetzt können Sie Ihr Bild anstatt des FontAwesome Icons sehen:

    Wordpress_How_to_change_an_iconic_icon_with_an_image-8

Sie können auch das ausführliche Video-Tutorial nutzen:

WordPress. Wie ersetzt man FontAwesome Icons durch Bilder

Wordpress Kaufen
Dieser Eintrag wurde um WordPress Tutorials geschrieben und font, icon, iconic, WordPress markiert. Bookmarken Sie den permalink.

Submit a ticket

Sollte Ihre Frage durch die Tutorials nicht ausreichend beantwortet worden sein, benutzen Sie bitte den folgenden Link, um sich an unser Beratungsteam (Support) zu wenden. Wir bieten Ihnen unsere Hilfe und Unterstutzung an. 24 Stunden am Tag, 7 Tage die Woche!
Ticket Einrichten