확장기능:TemplateStyles

This page is a translated version of the page Extension:TemplateStyles and the translation is 31% complete.
미디어위키 확장 기능 설명서
TemplateStyles
출시 상태: 안정
구현 태그 , ContentHandler ,
설명 함수에 의해 구문처리된 CSS 스타일시트를 틀로부터 불러옵니다.
만든 이
최신 버전 지속적으로 업데이트됩니다.
호환성 정책 스냅샷은 미디어위키와 함께 릴리스됩니다. Master is not backward compatible.
MediaWiki 1.30+
PHP 7.3+
라이선스 GNU General Public License 2.0 or later
다운로드
  • $wgTemplateStylesUseCodeEditor
  • $wgTemplateStylesDisable
  • $wgTemplateStylesDefaultNamespace
  • $wgTemplateStylesDisallowedAtRules
  • $wgTemplateStylesDisallowedProperties
  • $wgTemplateStylesAllowedUrls
  • $wgTemplateStylesAutoParseContent
  • $wgTemplateStylesMaxStylesheetSize
  • $wgTemplateStylesNamespaces
<templatestyles src=... />
Quarterly downloads 1,187 (Ranked 1st)
Public wikis using 1,977 (Ranked 199th)
TemplateStyles 확장 기능 번역 (translatewiki.net에서 가능한 경우)
이슈 미해결 작업 · 버그 보고

TemplateStyles은 사용자들이 위키 문서에 커스텀 CSS 코드를 저장할 수 있도록 하는 파서 확장기능입니다. 그리고 이 CSS 코드를 ‎<templatestyles> 태그를 이용해서 문서에 삽입할 수 있습니다. 이 확장기능은 안전한 CSS 구문만이 CSS 페이지에 저장될 수 있도록 합니다. css-sanitizer라는 라이브러리를 사용하였습니다.

편집자는 TemplateStyles를 통해 틀의 스타일을 포함하도록 권장됩니다. 이는 동일한 사용자가 틀과 스타일을 모두 편집할 수 있기 때문에, 이러한 방식으로 스타일은 필요할 때만 로드됩니다. (사이트 전체 MediaWiki:Common.css 에 추가하는 것과 비교하면).

위키에서 편집자로 확장기능을 사용하는 방법에 대한 지침은 도움말:TemplateStyles 를 참조.

사용법

먼저 CSS 문서를 생성해야 합니다. 특별히 문법 오류가 없을 경우 ".css"로 끝나는 틀 이름공간의 하위문서로 content model 인 "함수에 의해 구문 처리된 CSS"(Sanitized CSS)를 생성합니다.

이름 공간의 집합은 $wgTemplateStylesNamespaces로 조정될 수 있고, 또는 Special:ChangeContentModel 는 어떤 페이지에서도 사용할 수 있습니다. 다음, 틀 구문에 <templatestyles src="..." /> 태그를 추가하여 스타일들을 로드합니다.

The CSS saved using the "세니타이즈드 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, the offending constructs will be removed when the CSS is outputted to the browser.

The value of the src attribute on the tag is the title of the page, defaulting to the Template namespace. (기본값은 $wgTemplateStylesDefaultNamespace에 의해 변경될 수 있습니다.) 예를 들어 <templatestyles src="Example/styles.css" />은 "Template:Example/styles.css" 문서를 로드합니다. 페이지가 존재하지 않거나 "세니타이즈드 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 .

주의 사항

  • 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 also be sure to include the styles themselves rather than relying on some other template to do 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.

(See discussion from phab:T155813#2996589 and in phab:T176272.)

    • Including styles on a template that affects contents outside of that template will cause those styles not to be applied when editing a section that doesn't contain that template. Example: including styles on an info box 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 does not support CSS variables, see phab:T320322.
  • TemplateStyles allows a 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. See phab:T197617. 1.32+

설치

  • 파일을 다운로드하고 TemplateStyles 폴더를 extensions/ 디렉토리에 넣어 주세요.
    개발자와 코딩 기여자는 Git을 이용해 확장기능을 다운받는 것이 좋습니다.cd extensions/
    git clone https://gerrit.wikimedia.org/r/mediawiki/extensions/TemplateStyles
  • Git에서 설치할 경우, PHP 의존 기능을 설치하려면 Composer를 실행하여 확장 기능 디렉터리에 composer install --no-dev를 발행하십시오. (잠재적인 문제에 대해서는 작업 T173141 을 참고하십시오.)
  • 아래의 코드를 LocalSettings.php 코드의 마지막에 추가합니다.
    wfLoadExtension( 'TemplateStyles' );
    
  • 필요에 따라 구성
  •   완료 – 위키의 ‘Special:Version’에 이동해서, 확장기능이 올바르게 설치된 것을 확인합니다.


Vagrant 설치:

  • Vagrant 를 사용하고 있는 경우에는, vagrant roles enable templatestyles --provision로 설치해주세요
문법 강조니 자동 코드 편집기를 가진 보다 쾌적한 사용자 인터페이스를 위해서는 다음 확장기능을 설치하세요.

설정

설정하기
매개변수 기본값 비고
$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" => [
        "<.>"
    ],
]
PCRE regular expressions to match allowed URLs for various types of external references.

Keys are external reference types, and 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.
$wgTemplateStylesNamespaces [ NS_TEMPLATE => true ] Namespaces in which to set the "세니타이즈드 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 확장기능:코드 편집기 for the "세니타이즈드 CSS" content type.
$wgTemplateStylesAutoParseContent true If true, the "세니타이즈드 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.


가능한 오류

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 means a required library has not been installed. The error may come up when attempting to import a wiki CSS page or when changing the content model of a page to "sanitized-css". This was common in the past due to a bug in the extension distributor; shouldn't happen anymore.
    There is a generally method is update composer under the extension's directory.
  • Import failed: The content model 'sanitized-css' is not registered on this wiki.
    Happens when you try to import a wiki page created via TemplateStyles, but TemplateStyles is not installed on your wiki.


See also