Bilder in Text-Felder einfügen

Bilder können in Text-Felder von CMS-Elementen derzeit nur mit einen kleinen "Trick" (per HTML) eingefügt werden. Wie dies funktioniert erklären wir dir in dieser Anleitung.

1. Öffne die Administration deines Shops

2. Medienverwaltung

   1. Wechsel über die Hauptnavigation in die Medienverwaltung ("Inhalte" => "Medien")

   2. Suche das gewünschte Bild

   3. Kopiere nun den Pfad zum Bild mit einen Klick auf "Link kopieren" (1, 2) in die Zwischenablage

3. HTML-Code

   • Damit du das Bild als HTML-Element in ein Text-Feld einfügen kannst, musst du den Pfad in einen entsprechenden HTML-Code einfügen

   • Nutze dafür gerne das folgende Beispiel: <img src="..." alt="...">

     • Ersetze die Auslassungspunkte im Tag src mit der Bild-Pfad

     • Ersetze die Auslassungspunkte im Tag alt mit einer kurzen Bildbeschreibung des Bildes

4. Erlebniswelt-Verwaltung

   1. Wechsel über die Hauptnavigation in die Erlebniswelt-Verwaltung ("Inhalte" => "Erlebniswelten")

   2. Öffne nun das gewünschte CMS-Layout

   3. Klicke auf das "Zahnrad"-Icon um das gewünschte CMS-Element zu konfigurieren
   4. Es öffnet sich das Pop-up "Element-Einstellungen"

   5. Klicke auf das "Code"-Icon um in den HTML-Modus zu wechseln (3)
   6. Füge nun den oben erstellten HTML-Code an der gewünschten Stelle ein

   7. Warte kurz ab, bis der HTML Sanitizer von Shopware 6 den Code geprüft hat

   8. Speicher deine Änderungen

Du hast nun ein Bild in ein Text-Feld eingefügt.

Screenshots

Hinweis: Fehlt ein Bild in der Storefront hat sich wahrscheinlich der Pfad zum Bild (z.B. durch Umbenennen oder Verschieben) geändert. Korrigiere den Pfad dann einfach indem du die oben genannten Schritte wiederholst.

Code-Beispiel

<img src="..." alt="...">

---

Weiterführende Informationen

Mehr Informationen zum Thema HTML-Code einfügen und dem HTML Sanitizer von Shopware 6 findest du in folgendem Artikel:

pageHTML-Code