Erweiterung:TemplateStyles

This page is a translated version of the page Extension:TemplateStyles and the translation is 9% complete.
MediaWiki-Erweiterungen
OOjs UI icon advanced-invert.svg
TemplateStyles
Freigabestatus: stabil
Einbindung Tag , ContentHandler , Hook
Beschreibung Erlaubt das Laden von bereinigten CSS Stylesheets aus einer Vorlage.
Autor(en)
Letzte Version Continuous updates
Kompatibilitätspolitik Snapshots releases along with MediaWiki. Master is not backward compatible.
MediaWiki >= 1.38.0
PHP 7.3+
Lizenz GNU General Public License 2.0 oder neuer
Herunterladen
  • $wgTemplateStylesUseCodeEditor
  • $wgTemplateStylesDisable
  • $wgTemplateStylesDefaultNamespace
  • $wgTemplateStylesDisallowedAtRules
  • $wgTemplateStylesDisallowedProperties
  • $wgTemplateStylesAllowedUrls
  • $wgTemplateStylesAutoParseContent
  • $wgTemplateStylesMaxStylesheetSize
  • $wgTemplateStylesNamespaces
<templatestyles src=... />
Übersetze die TemplateStyles-Erweiterung, wenn sie auf translatewiki.net verfügbar ist

Prüfe die Benutzungs- und Versionsmatrix.

Probleme Offene Aufgaben · Einen Fehler melden

Die TemplateStyles Erweiterung führt eine ‎<templatestyles> Markierung ein, um anzuzeigen, dass ein Stylesheet von einer Wiki Seite geladen werden soll. Placing this in a template allows the template to have custom styles without having to place them in MediaWiki:Common.css .

For instructions on how to use the extension as an editor on a wiki, see Hilfe:TemplateStyles .

Verwendung

First, the CSS page must be created. By default any subpage in the Template namespace with a title ending in ".css" will be created with the "Sanitized CSS" content model if it contains no syntax errors.

The set of namespaces may be adjusted with $wgTemplateStylesNamespaces, or Special:ChangeContentModel may be used on any page. Then, in the template's wikitext, add the <templatestyles src="..." /> tag to load the styles.

The CSS saved using the "Sanitized CSS" content model must meet strict validity requirements: invalid CSS, unrecognized at-rules, and unrecognized or unsupported properties or property values cannot be saved. If invalid CSS is somehow saved anyway, the offending constructs will be removed when the CSS is output to the browser.

The value of the src attribute on the tag is the title of the page, defaulting to the Template namespace. (This default can be changed via $wgTemplateStylesDefaultNamespace.) For example, <templatestyles src="Example/styles.css" /> will load the page "Template:Example/styles.css". This will fail if that page does not exist or has a content model other than "Sanitized CSS".

Styles can be scoped within the page by using the optional wrapper parameter to the tag, e.g. <templatestyles src="Example/styles.css" wrapper="div.example" /> would scope the styles loaded to any <div class="example"> inside the main parsed content. Any CSS simple selector sequence can be used for the wrapper parameter. This is intended to allow side-by-side comparison of live and sandbox versions of a template.

Use of sanitized CSS is tracked like transclusion of templates, and will show up as a transclusion on Special:WhatLinksHere .

Caveats

  • Styles added by TemplateStyles are scoped into .mw-parser-output to avoid tampering with the user interface outside of the main parsed content.
    • To use TemplateStyles to style something like w:MediaWiki:Protectedpagetext, you would need to enclose the message's contents in <div class="mw-parser-output">...</div>.
  • The styles should be written to target specific CSS classes, and anything that generates elements with those classes should be sure to also include the styles itself rather than relying on some other template to have done so.
    • Styles included by a template can currently affect content on the page outside of the content generated by that template, but this ability may be removed in the future and should not be relied upon.
    • Including styles on a template that affects contents outside of that template, will cause those styles to not be applied when editing a section that doesn't contain that template. Example: including styles on an infobox that affect all tables of the page, when editing a section that doesn't contain the infobox, those tables won't be styled when previewing that section.
  • TemplateStyles allows few non-standardized CSS properties.

Requests to support additional properties should be filed in Phabricator in the css-sanitizer and TemplateStyles projects.

    • Requests should include links to standards-track documents (e.g. on w3.org) describing the syntax of the properties being requested, and an analysis of current browser support for the properties (e.g. a link to a caniuse.com page about the properties).
    • Vendor-prefixed properties (e.g. anything starting with -webkit-, -moz-, or -ms-) are likely to be declined if they're not needed for modern browsers.
  • @font-face rules must use a font-family prefixed with "TemplateStyles".

This should largely prevent redefining fonts used elsewhere in the document.

  • To target styles based on skins, use a selector such as body.skin-vector .myClass; specification of the body element is required and must be followed by a descendant combinator (i.e. the space).

Other classes on the body or html elements may be targeted in the same manner. 1.32+

Installation

  • Wird Vagrant benutzt, ist mit vagrant roles enable templatestyles --provision zu installieren
Manuelle Installation
  • Die Erweiterung herunterladen und die Datei(en) in ein Verzeichnis namens TemplateStyles im Ordner extensions/ ablegen.
  • Wird von git aus installiert, ist Composer auszuführen, um PHP-Abhängigkeiten zu installieren, indem composer install --no-dev im Erweiterungsverzeichnis ausgeführt wird. (Siehe task T173141 für mögliche Komplikationen.)
  • Folgenden Code am Ende der LocalSettings.php hinzufügen:
    wfLoadExtension( 'TemplateStyles' );
    
  • Configure as required.
  •   Erledigt – Zu Special:Version in dem Wiki (bei Einstellung auf deutsch nach Spezial:Version) navigieren, um die erfolgreiche Installierung der Erweiterung zu überprüfen.
For a more pleasant user interface, with syntax highlighting and a code editor with autoindent, install the following extensions:

Konfiguration

Configuration settings
parameter default comment
$wgTemplateStylesAllowedUrls
[
    "audio" => [
        "<^https://upload\\.wikimedia\\.org/wikipedia/commons/>"
    ],
    "image" => [
        "<^https://upload\\.wikimedia\\.org/wikipedia/commons/>"
    ],
    "svg" => [
        "<^https://upload\\.wikimedia\\.org/wikipedia/commons/[^?#]*\\.svg(?:[?#]|$)>"
    ],
    "font" => [],
    "namespace" => [
        "<.>"
    ],
    "css" => []
]
PCRE regular expressions to match allowed URLs for various types of external references.

Keys are external reference types, values are arrays of regular expressions (including delimiters) to match allowed URLs. Current external reference types are:

audio
Sound file, for cue properties of the CSS Speech Module.
image
Image file, for properties such as background.
svg
SVG file, for Masking and Filters.
font
For @font-face's src.
namespace
For @namespace.
css
For @import.
$wgTemplateStylesNamespaces
[ NS_TEMPLATE => true ]
Namespaces in which to set the "Sanitized CSS" content model for titles ending in ".css".

Enabling this for 2 (User) or 8 (MediaWiki) is a bad idea, as it will conflict with the normal CSS files in those namespaces.

$wgTemplateStylesPropertyBlacklist
[]
Properties to blacklist in CSS style rules.

The TemplateStylesPropertySanitizer hook allows for finer-grained control.

$wgTemplateStylesAtRuleBlacklist
[]
At-rules to blacklist in stylesheets.

The TemplateStylesStylesheetSanitizer hook allows for finer-grained control.

$wgTemplateStylesUseCodeEditor
true
Whether to enable Extension:CodeEditor for the "Sanitized CSS" content type.
$wgTemplateStylesAutoParseContent
true
If true, the "Sanitized CSS" content model will be added to $wgTextModelsToParse if the CSS content model is already present in that array.

If false, add 'sanitized-css' to that array manually if you want categories and such parsed out of the CSS page.

$wgTemplateStylesMaxStylesheetSize
102400
Maximum size (in bytes) of a stylesheet. null for no limit.
$wgTemplateStylesDefaultNamespace
NS_TEMPLATE
The default namespace for the src attribute of the ‎<templatestyles> tag.

Other dependencies

$wgTidyConfig should be configured to use no tidying or RemexHtml. If used with any of the Raggett drivers, a ‎<templatestyles /> tag in the middle of a paragraph (including in an inline template) will cause tidy to break the paragraph at that point. The other drivers have not been tested for this issue.

Potential errors

If you experience an error when importing pages from another wiki, for example, it may help to enable $wgShowExceptionDetails in your LocalSettings.php to determine if you are experiencing any of the errors below.

  • Class 'Wikimedia\CSS\Parser\Parser' not found
    This error may come up when attempting to import a wiki CSS page or when changing the content model of a page to "santized-css". There is, as of April 16, 2020, an open bug in the extension distributor which requires composer install --no-dev to be run in the extension subdirectory even when the extension is not installed from Git. See Topic:Ukv6pdo96a8qfur2 for details.
  • Import failed: The content model 'sanitized-css' is not registered on this wiki.
    Some people get this error on a wiki when importing pages. This extension provides that content model. Install TemplateStyles to fix your import.

Siehe auch