Extension:CSS

This page is a translated version of the page Extension:CSS and the translation is 97% complete.
MediaWiki 拡張機能マニュアル
CSS
リリースの状態: 安定
実装 パーサー関数
説明 CSS ファイル、記事、インライン ルールをページに追加するためのパーサー機能を提供する
作者
最新バージョン 3.5.0
MediaWiki >= 1.31.0
ライセンス GNU 一般公衆利用許諾書 2.0 以降
ダウンロード
organicdesign.nz
  • $wgCSSPath
  • $wgCSSIdentifier
四半期ごとのダウンロード数 124 (Ranked 43rd)
translatewiki.net で翻訳を利用できる場合は、CSS 拡張機能の翻訳にご協力ください
問題点 未解決のタスク · バグを報告

CSS 拡張機能は、特定の記事に対し、CSS スタイルシートによる表示を行えるようにするものです。CSS は、構文解析機能により、直接定義された規則、または他の記事やファイルともなりえます。

使用法

例えば、"MyFancyUserPage" という記事で使用するためのスタイルである "MyStyles.css" という CSS記事がある場合、後者に以下のパーサー関数構文を追加することになるでしょう。

{{#css:MyStyles.css}}

一方、"MyStyles.css" が/wiki/skinsディレクトリのファイルであった場合、以下のように含まれることになります。ファイルは、記事のタイトルと区別するために、スラッシュを先頭につけた絶対パスでなければならないことに注意してください。

{{#css:/skins/MyStyles.css}}

また、次の例のように、CSSルールをパーサー関数内に直接含めることもできます(inline)。

{{#css:
  body {
    background: yellow;
    font-size: 20pt;
    color: red;
  }
}}

インストール

  • ダウンロードして、ファイルをextensions/フォルダー内のCSSという名前のディレクトリ内に配置します。
    開発者とコード寄稿者は、上記の代わりに以下を使用してGitからインストールします:cd extensions/
    git clone https://gerrit.wikimedia.org/r/mediawiki/extensions/CSS
  • 以下のコードを LocalSettings.php ファイルの末尾に追加します:
    wfLoadExtension( 'CSS' );
    
  • 必要に応じて設定します。
  •   完了 – ウィキの「Special:Version」に移動して、拡張機能が正しくインストールされたことを確認します。

設定

オプションで、外部ファイルのベースURLを設定することができます。

$wgCSSPath = false;  # 既定値、$wgScriptPathの相対パス
$wgCSSPath = '';  # サーバーのルートに相対
$wgCSSPath = 'https://example.org/stylesheets';  # 別サイトとの相対比較

PageCSSの代替として使用する

以前のExtension:PageCSS (現在はアーカイブされています)では、#css:パーサー関数の代わりに‎<css>‎</css>タグを使用していたものがあります。 この拡張機能は、それらの拡張機能が提供することのほとんどを行うことができますが、構文には互換性がありません。 古い‎<css>タグを使用している既存のページを壊さないようにする一つの方法は、このExtension:CSSExtension:NewPageCSS の両方を同じwikiで使用することです。

別の解決策 (この拡張モジュールだけを使用したいが、Extension:PageCSSを期待する既存のコンテンツがある場合) は、このスタブ関数を PHP ファイルとして保存し、LocalSettings.php からそれをインクルードして <css> を#cssにリマップすることです。

<?php

// <css></css> タグを {{#css:}} パーサ関数拡張に再マップするスタブ

// 既存のウィキで Extension:NewPageCSS を置き換えるためにhttps://www.mediawiki.org/wiki/Extension:CSSをインストールする際に使用します。

$wgHooks['ParserFirstCallInit'][] = 'wfCSSParserStubInit';
 
// コールバック関数をパーサーに追加する
function wfCSSParserStubInit( Parser $parser ) {

        // パーサーが<css>タグを見たとき、スタブwfCSSTagRender関数(下記)を実行し、{{#css:}}パーサーを呼び出します。
        $parser->setHook( 'css', 'wfCSSTagRender' );
        return true;
}
// <css>タグの実行
function wfCSSTagRender( $input, array $args, Parser $parser, PPFrame $frame ) {

        // スタブ関数、ユーザー提供の入力テキストをウィキテキストとして再パースするために {{#css:}} パーサー関数に盲目的にリダイレクトするだけです
        $output = $parser->recursiveTagParse('{{#css:' . $input . '}}', $frame);
        return $output;
}

この時点で、以前の PageCSS (または NewPageCSS) 拡張機能は設定から削除されます。<css> は#css:に移動し、(このCSS拡張機能がすでに稼働している場合)他のCSS拡張機能が常に持つように動作するようになります。

特定のページの色や背景を変更する際の問題点

パーサー機能を使用して他のページのCSSを使用しても、ページの色や背景を変更することはできませんが、1つのページ単体でパーサー機能を使用すると、背景を変更することが可能です。 To overcome this problem, it is possible to load the CSS through transclusion, which does not cause the problem of failing to load the change to the page background.

バグ

トークページを参照してください。

関連項目