SVG-Logos in WordPress nutzen

Avatar von Arto Steiner

17. Oktober 2017

·

Lesezeit ca. 2 Min

WordPress akzeptiert keine SVG-Dateien

Hast du schon mal probiert ein Logo im SVG-Format? Geht nicht.

WordPress lässt das nicht zu und sagt uns, dass das Format SVG nicht unterstützt wird.

Warum lässt das WordPress nicht zu?

Aus Sicherheitsgründen. SVG ist nicht ein reines Bildformat, sondern es können zum Beispiel auch Skripte eingebettet werden. Das bringt dann erhebliche Gefahren mit sich.

WordPress hat eine Art eine Whitelist für Dateiformate. Gewisse Dateien werden zugelassen, andere standardmässig geblockt – was natürlich manuell geändert werden kann…

Warum das SVG-Format nutzen?

Mit SVG kann ich zum Beispiel ein Logo als Vektorgrafik nutzen und sogar Einfluss nehmen auf Teile des Logos mit CSS.

In der heutigen Zeit mit Responsive Design, Bildschirmen mit unterschiedlichsten Grössen und Auflösungen (Stichwort “Retina Display”) braucht man zum Beispiel mehrfach das Logo in unterschiedlichen Grössen, wenn man ein PNG nimmt. Im SVG-Format kann ich ein Logo für alle Grössen und Auflösungen nutzen. Vektorgrafik halt.

Plugin-Tipps

Mit diesen Plugins kann die SVG-Unterstützung von WordPress aktiviert werden und die Berechtigung angepasst werden, dass zum Beispiel nur Administratoren SVG-Dateien hochladen können – was die Sicherheit erhöht.

Vorgehen nachdem du das Plugin installiert hast

Einfach: Nach der Installation des Plugins kannst du wie gewohnt im Customizer von WordPress ein Logo hochladen. Nur diesmal als SVG statt als PNG.

Avatar von Arto Steiner

Gründer · Kursleiter · Webdesigner

Diskussion

7 Kommentare zu «SVG-Logos in WordPress nutzen»

  1. Avatar von Christine

    Hallo Arto

    Danke für den Plugin-Tipp!
    Wie sieht es tatsächlich mit der Sicherheit aus, wenn ich SVGs via Plugin hoch lade? Hast du ein Worst Case dazu?

    Liebe E-Grüsse
    Christine

    1. Avatar von Arto Steiner
      Arto Steiner

      Hallo Christine, die Hauptgefahr liegt in der Datei selbst. Wenn ich also einstelle, dass nur Admins SVG Files hochladen kann und die Admins den Inhalt dieser Dateien kennen, sollte das meines Erachtens nicht gefährlich sein…

  2. Avatar von dirk

    wie krieg ich denn mein illdy theme dazu das svg auch zu laden? ich kann zwar svg (als admin) in die mediathek hochladen, aber der customizer vom illdy theme lasst kein beschneiden der svg datei zu… muss ich das händisch in der header.php einbauen, oder irgendwie verlinken?

    1. Avatar von Arto Steiner
      Arto Steiner

      Das Beschneiden vor dem Upload machen.

  3. Avatar von Moritz K.
    Moritz K.

    Ich habe eine Frage dazu. Wenn ich so vorgehen und das Lpgo unter den Theme Einstellungen hochladen, habe ich das Problem, dass das Logo in einem Tag eingebunden wird. Dadurch lässt es sicher nicht per css anpassen. Wie löse ich das Problem?

    1. Avatar von Arto Steiner
      Arto Steiner

      Das sollte kein Grund sein, das Logo nicht per CSS anpassen zu können. Warum denn? Hast du ein Beispiel?

  4. Avatar von Dirk

    Hallo Arto,

    danke für die Beschreibung. Der Upload meines SVG Logos klappt problemlos, doch leider wird es bei meiner WordPress-Installation immer auf voller Seitenbreite angezeigt und nicht skaliert, obwohl im SVG die Skalierung angegeben ist.
    Ich nutze das Genesis Framework mit dem Child-Theme Foodie-Pro und bekomme es mit CSS nicht angepasst (kenne mich mit CSS aber auch so gut wie gar nicht aus). Mein Theme ist offenbar so programmiert, dass es jedes Header-Bild erst einmal unskaliert anzeigt. (https://feastdesignco.com/rethinking-the-header/) Gibt es eine Möglichkeit, das SVG mit der zusätzlichen CSS im Customizer zu skalieren?

    Herzliche Grüße,
    Dirk
    (derzeit habe ich wieder das png als Logo online)

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Wissen für deine Website

Neue Beiträge, Kurs-Termine und Tipps aus der Praxis. Kein fixer Rhythmus – nur wenn was Wichtiges da ist.