Externe Stylesheet - Background-Images Pfade

[tom.loeschnigg]

Hi liebe Community,

bräuchte wieder mal eure Meinung.

Wenn ich in Contao 3 externe Stylesheets einbinde, stimmen die Pfade zu den Background-Images nicht mehr.

Wenn ich mir das im Frontend ansehe bekomme ich folgenden Pfad: /assets/img/bild.png

Muss ich alle Bildpfade in den CSS-Files anpassen? Wenn ja, wie lautet da der korrekte Pfad dann?
Ordnerstruktur:

• files/layout/img
• files/layout/css

Wenn ich den Pfad wie folgt ändere, dann passt alles ../../files/layout/img/bild.png.

Mir kommt das aber doch etwas eigenartig vor, dass der Pfad nicht von root ausgeht, also files/layout/img/bild.png

Wäre für eure Meinung sehr dankbar!

Liebe Grüße
Tom

[bizon]

Wenn ich den Pfad wie folgt ändere, dann passt alles ../../files/layout/img/bild.png.

Mir kommt das aber doch etwas eigenartig vor, dass der Pfad nicht von root ausgeht, also files/layout/img/bild.png

Seit Contao 3.0 landen alle CSS-Dateien, egal ob durch das Contao-Framework oder durch Theme+ eingebunden, in ~/assets/css. Von da aus geht nun auch der relative Pfad: ../../files/PfadZum/Bild.jpg

[tom.loeschnigg]

Ich bin immer wieder erstaunt wie schnell man hier eine Antwort bekommt. Die Contao Community ist mit Abstand die Beste dich in meiner 10 jährigen Karriere als Webdesigner erlebt habe.

[ToNoma]

Bin gerade auch über diese Besonderheit in Contao3 gestolpert.

Mehr dazu auch auf GitHub: https://github.com/contao/core/issues/5039

Wer die Option "Zusätzliche Stylesheets" aus Themes->Seitenlayout benutzt, muss in der CSS-Datei die Pfadangaben zu Dateien (wie z.B. backgroud-image, list-style-image, etc.) relativ zur CSS-Datei machen und die Pfadangabe in doppelte Hochkommas ("pfad") setzen.

Beispiel:

files
-----css
--------style.css
-----Hintergrundbilder
--------hintergrundbild1.jpg

Die Pfadangabe in der style.css CSS-Datei sieht für diese Verzeichnisstruktur wir folgt aus:

background-image:url("../Hintergrundbilder/hintergrundbild1.jpg");