Inline-Skripte und -Styles entfernen #

Diese Seite ist für Designer, die ein Theme betreuen, das geschrieben wurde, bevor Content Security Policies üblich waren. Wie CSP-sichere Templates gehen, steht in CSP-sicheres Design, Kein Inline-JavaScript und Kein Inline-CSS; diese Seite ist die Migrationsroutine.

Warum jetzt #

Exponential sendet eine Content Security Policy aus site.ini [ContentSecurityPolicy]: standardmäßig report-only in der Administration und aus auf Websites, mit script-src 'self' und style-src 'self' (Content Security Policy). Ein Website-Betreiber, der sie für seine Website einschaltet, braucht ein Theme ohne Inline-Code.

Die Themes von 7x haben diese Migration in ihren Releases vom 17. Oktober 2026 vollzogen: cjw_themes_jumper v0.1.6 („the starter design without inline scripts“), sevenx_themes_simple v1.0.24 und sevenx_themes_media v1.5.70.

Schritt für Schritt #

1. Finden Sie Inline-Code:

   grep -rn -E "<script[^>]*>[^<]|on(click|change|load|submit)=|javascript:|style=\"" extension/mytheme/design

2. Verschieben Sie Skripte in Dateien in design/mytheme/javascript/ und laden Sie sie über die Skriptliste des Designs.

3. Ersetzen Sie Event-Attribute und javascript:-Links durch href="#" oder Schaltflächen plus data-*-Attribute, die eine Skriptdatei liest, wie es cjw_themes_jumper 0.1.6 mit data-cjw-bubble getan hat.

4. Übergeben Sie Werte aus Templates in data-*-Attributen, statt sie in Skriptblöcke zu schreiben.

5. Ersetzen Sie style="" durch Klassen im Stylesheet; Werte pro Element gehören in data-*-Attribute oder in Custom Properties, die von einer Klasse gesetzt werden.

6. Testen Sie mit der Richtlinie im Modus report-only auf einem Test-Siteaccess (Mode=report-only) und lesen Sie die Browserkonsole: keine Meldungen.

Verwandte Seiten #

• Eine CSP-Prüfung bei jedem Release
• Checkliste: CSP
• Freie Dokumentation: Diese Seite darf unter der GNU FDL 1.3 frei kopiert, übersetzt und verbessert werden.