Benutzer-Werkzeuge

Webseiten-Werkzeuge


webedition:tipps:cssjsids

webEdition IDs in CSS und JavaScript Dateien einsetzen

Generelles Vorgehen

Seit webEdition 6.3.9 können IDs von webEdition Dokumenten und Grafiken auch in CSS (less/sass) und Javascript Dateien eingesetzt werden. Wurde früher im CSS folgendes geschrieben:

html, body { 
background: url("http://documentation.webedition.org/wiki/lib/tpl/dokuwiki/images/page-gradient.png") repeat-x #FBFAF9;
color: #333333;
margin: 0px;
padding: 0px;
}

Kann dies nun so geschrieben werden:

html, body { 
background: url("#WE:7766#") repeat-x #FBFAF9;
color: #333333;
margin: 0px;
padding: 0px;
}

Damit die ID auch wirklich ersetzt wird, muß bei der CSS/JS Datei auf der Eigenschaftsseite noch die Checkbox "Datei von Parser verarbeiten lassen" aktiviert werden.

Wurden nun die Grafiken verschoben, müssen die Pfade nicht mehr händisch angepaßt werden, es muß (aktuell) lediglich eine Rebuild aller statischen Dokumente erfolgen.

Einbinden in SCSS/LESS

Die Einbindung von Dateien in LESS und SCSS funktioniert in gleicher Weise wie auch bei normalen CSS Dateien. Zusätzlich können in den CSS-Präprozessoren import-Anweisungen ebenfalls mit den internen webEdition-ID's angegeben werden. In SCSS sieht das bspw. so aus:

$mainColor:#00005C;
@import '#WE:18823#';
webedition/tipps/cssjsids.txt · Zuletzt geändert: 2016/01/27 19:02 von Marc Krämer

Recent changes RSS feed