Contao-Summit 2026

Ankündigung

Collapse
No announcement yet.

inline SVG

Collapse
X
 
  • Filter
  • Zeit
  • Show
Clear All
new posts

    5.7.x inline SVG

    Beiträge, die ich zum Thema gefunden habe, waren schon älter, und die Leute wollten dort SVG-Dateien einfügen. Ich möchte aber SVG-Elemente (Tags) direkt in den Text einfügen.

    Warum will ich das? Ich verwende gern kurze SVG-Sequenzen für Symbole. Wenn ich die SVG-Tags direkt in den Text einfüge, kann ich die Farbe "currentColor" verwenden, die sich automatisch ändert, wenn der Nutzer vom Light- in den Dark-Mode umschaltet. Das ermöglicht es, Darstellungen zu erzeugen, die sowohl vor hellem wie auch dunklem Hintergrund funktionieren.

    Den SVG-Code schreibe ich selbst, oft mittels Python-Scripten, und benutze keinen SVG-Editor dazu. Dadurch sind das dann nur wenige Zeilen, die man tatsächlich direkt mit in den Text setzen kann. Auch das Problem mit XML- und DOCTYPE-Header besteht dann nicht.

    Wenn ich im Text-Editor den Quellcode öffne und dort SVG-Tags hineinschreibe, werden sie wieder entfernt. So geht es also nicht.

    Ein Inhaltselement "Ungefiltertes HTML" kann man nehmen. Da wird SVG angezeigt. Aber das kann man nicht in den laufenden Text integrieren.

    Geht es irgendwie, SVG in laufenden Text einzubauen?

    #2
    Moin,

    das sollte gehen, wenn Du <svg> als HTML Tag erlaubst.

    Einstellungen -> Sicherheitseinstellungen -> erlaubte HTML-Tags. Da das svg Tag hinzufügen. Ob Du auch bei den Attributen noch was ergänzen musst, kann ich Dir nicht sagen.

    Alternativen:
    Du könntest unter Themes bei den Inhaltselementen Deines Themes Deine SVGs als ungefiltertes HTML-Element anlegen. Die kannst Du dann an gewünschter Stelle per Insert Tag einbinden.
    Man kann dieSVGs auch in der Dateiverwaltung anlegen und dann über verschiedene Möglichkeiten einbinden (als Inhaltselement Bild z.B.).

    Gruß
    Mathias
    The idea is to die young as late as possible!

    Comment

    Working...
    X