Extension:TemplateStyles
TemplateStyles リリースの状態: 安定 |
|
---|---|
実装 | タグ , ContentHandler , フック |
説明 | テンプレートからサニタイズ済みの CSS スタイルシートを読み込めるようにする。 |
作者 | |
最新バージョン | 継続的な更新 |
互換性の方針 | MediaWiki とともにリリースされるスナップショット。 master には後方互換性がありません。 |
MediaWiki | 1.30+ |
PHP | 7.3+ |
ライセンス | GNU 一般公衆利用許諾書 2.0 以降 |
ダウンロード | |
|
|
<templatestyles src=... /> |
|
四半期ごとのダウンロード数 | 1,190 (Ranked 1st) |
使用中の公開ウィキ | 1,977 (Ranked 199th) |
translatewiki.net で翻訳を利用できる場合は、TemplateStyles 拡張機能の翻訳にご協力ください | |
問題点 | 未解決のタスク · バグを報告 |
TemplateStyles 拡張機能は、ユーザーがウィキページにカスタムCSSコードを格納し、<templatestyles>
タグを介してこれらのスタイルを記事に埋め込むことを可能にするパーサー拡張機能です。 この拡張機能は、埋め込み可能なスタイルページに、安全なCSS構文のサブセットのみを格納することを許可します。これは、css-sanitizerライブラリによって実現されています。
編集者は、TemplateStyles を通してテンプレートにスタイルを含めることが推奨されます。なぜなら、(サイト全体の MediaWiki:Common.css スタイル追加することに比べたら)これにより同じユーザーが同時にテンプレートやそのスタイルを編集することができるようになり、また必要なときにだけスタイルを導入することができます。
拡張機能をウィキのエディターとして使用する方法は、Help:TemplateStyles を参照してください。
使用法
まず、CSSページを作ってください。 既定では、「.css」で終わるテンプレート名前空間の下位ページは、すべて、文法エラーがなければ「サニタイズCSS」content model で作成されます。
名前空間の集合が$wgTemplateStylesNamespaces
で修正されるか、あるいはSpecial:ChangeContentModel が任意のページで使用される場合があります。
そして、テンプレートのwikitextに、スタイルを読み込むための<templatestyles src="..." />
タグを追加します。
「サニタイズCSS」コンテンツモデルを使用して保存されたCSSは厳密な妥当性要件を満たさなければなりません。無効なCSS、認識されない@-規則、認識されない、あるいはサポートされないプロパティーまたはプロパティーの値は保存できません。 無効なCSSがなぜが保存されてしまった場合、そのCSSがブラウザに出力された際に問題のある内容は取り除かれます。
タグの要素 src
の値はページタイトルであり、既定はテンプレート名前空間となります。
(この既定値は $wgTemplateStylesDefaultNamespace
で変更できます。)
例えば、<templatestyles src="Example/styles.css" />
は "Template:Example/styles.css"をロードします。
そのページが存在しないか、「サニタイズCSS」以外のコンテンツモデルを持つ場合は失敗します。
スタイルはタグの省略可能な wrapper
パラメーターを使用してページ内でスコープさせることができます。例えば <templatestyles src="Example/styles.css" wrapper="div.example" />
はロードしたスタイルをパース済みコンテンツ内のすべての <div class="example">
にスコープします。
wrapper
パラメーターには、すべてのCSSシンプルセレクター構文が利用できます。
これは、テンプレートのライブ版とサンドボックス版を並べて比較できるようにするためのものです。
Use of sanitized CSS is tracked like transclusion of templates and will show up as a transclusion on Special:WhatLinksHere .
注意
- TemplateStylesによって追加されるスタイルは、パース済みメインコンテンツ以外に影響を与えないように
.mw-parser-output
でスコープされます。- TemplateStylesを使用してw:MediaWiki:Protectedpagetextのようなスタイルにしたい場合、メッセージ内容を
<div class="mw-parser-output">...</div>
で囲む必要があります。
- TemplateStylesを使用してw:MediaWiki:Protectedpagetextのようなスタイルにしたい場合、メッセージ内容を
- スタイルは特定のCSSクラスに絞って記述すべきであり、それらのクラスを持つエレメントを生成するものは自身でスタイルを含めるようにすべきで、他のテンプレートに依存すべきではありません。
- 現在はテンプレートに含まれたスタイルはそのコンテンツ以外のページ中のコンテンツにも影響を与えることができますが、この機能は将来的に削除される可能性があるため信頼してはなりません。 (See discussion from phab:T155813#2996589 and in phab:T176272.)
- テンプレートのコンテンツ外に影響するスタイルが含まれている場合、そのテンプレートを含まないセクションの編集中のプレビューにスタイルが適用されなくなります。 例:インフォボックスにページ内のすべてのテーブルに影響するスタイルを含めた場合、インフォボックスを含まないセクションを編集しプレビュー表示したとき、それらのテーブルにはスタイルは適用されません。
- TemplateStylesはCSS変数をサポートしていません(devmo:Web/CSS/Using_CSS_custom_properties参照)。
- TemplateStylesはいくつかの非スタンダードなCSSプロパティを許可します。 追加のプロパティをサポートするためのリクエストは、Phabricatorのcss-sanitizerとTemplateStylesプロジェクトで申請してください。
- 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.
- Vendor-prefixed properties (e.g. anything starting with
@font-face
rules must use afont-family
prefixed with "TemplateStyles".
これにより、文書内の他の場所で使用されているフォントの再定義をほぼ防ぐことができるはずです。
- To target styles based on skins, use a selector such as
body.skin-vector .myClass
; specification of thebody
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+
インストール
- ダウンロードして、ファイルを
extensions/
フォルダー内のTemplateStyles
という名前のディレクトリ内に配置します。
開発者とコード寄稿者は、上記の代わりに以下を使用してGitからインストールします:cd extensions/
git clone https://gerrit.wikimedia.org/r/mediawiki/extensions/TemplateStyles - Gitでのインストールの場合のみ、PHPの依存関係をインストールするためComposerを実行します。 (合併症の可能性についてはタスク 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:
|
$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
|
[]
|
CSSスタイルルールでブラックリスト化するプロパティ。
The TemplateStylesPropertySanitizer hook allows for finer-grained control. |
$wgTemplateStylesAtRuleBlacklist
|
[]
|
スタイルシートでブラックリスト化するアットルール。
The TemplateStylesStylesheetSanitizer hook allows for finer-grained control. |
$wgTemplateStylesUseCodeEditor
|
true
|
Whether to enable Extension:CodeEditor 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 |
$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.
|
その他の依存関係
$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.
その他のドライバについては、この問題の検証は行っていません。
潜在的なエラー
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
- これは、必要なライブラリがインストールされていないことを意味します。 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.
- これは、必要なライブラリがインストールされていないことを意味します。 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.
Import failed: The content model 'sanitized-css' is not registered on this wiki.
- TemplateStylesで作成されたWikiページをインポートしようとしたが、TemplateStylesがWikiにインストールされていない場合に起こります。
関連項目
- Help:TemplateStyles
- css-sanitizer - CSS のサニタイズに使用されます。
- phab:T483 "RfC: Allow styling in templates" (about possibly deploying this extension on Wikimedia wikis)
- phab:T56864 "ResourceLoader: Implement support for LESS in wiki modules (user and site), supporting e.g. MediaWiki:Common.less"
- phab:T155813 "Decide on storage and delivery method for TemplateStyles CSS"
- It’s now easier to craft content for mobile devices: Responsive web design at the Wikipedia scale on the Wikimedia Blog.
- Extension:TemplateStylesExtender
この拡張機能は 1 つ以上のウィキメディアのプロジェクトで使用されています。 これはおそらく、この拡張機能が安定していて高いトラフィックのウェブサイトでも十分に動作することを意味します。 この拡張機能がインストールされている場所を確認するには、ウィキメディアの設定ファイル CommonSettings.php および InitialiseSettings.php 内で、この拡張機能の名前を探してください。 特定のウィキにインストールされている拡張機能の完全な一覧は、そのウィキの Special:Version ページにあります。 |
この拡張機能は以下のウィキ ファーム/ウィキ ホスト/パッケージに含まれています: これは正式な一覧ではありません。 一部のウィキ ファーム/ウィキ ホスト/パッケージは、ここに記載されていなくてもこの拡張機能を含んでいる場合があります。 必ずご利用のウィキ ファーム、ウィキ ホスト、バンドルで確認してください。 |