討論

Extension:CSS

CSS擴展允許將CSS樣式表載入到特定文章中。CSS樣式表可以是另一個文檔，也可以是直接在解析器函數中定義的規則。

用法

例如，如果你有一個名為「MyStyles.css」的CSS樣式表，它們是用於頁面「MyFancyUserPage」的樣式，你可以為後者添加以下解析器函數語法： 

{{#css:MyStyles.css}}

再者，如果「MyStyles.css」是位於 /wiki/skins 目錄之下的文件，那麼路徑應該也被寫進去，如下所示。請注意，檔案路徑必須是帶有文件根目錄斜槓的絕對路徑，以將其與檔名區分開來。 

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

或者，CSS規則可以直接包含（inline）在解析器函數中，如下例所示： 

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

安裝

  • 下載文件，並將其放置在您extensions/文件夾中的CSS目錄內。
  • 將下列代碼放置在您的LocalSettings.php的底部：
    :wfLoadExtension( 'CSS' );
  • 按需求配置
  • Yes.png 完成 – 在您的wiki上導航至Special:Version，以驗證已成功安裝擴展。

配置

你可以為擴展文件設置基本URL，可選。 

$wgCSSPath = false;  #  默认，与 $wgScriptPath 有关
$wgCSSPath = '';  #  与服务器根基（root）有关
$wgCSSPath = 'https://example.org/stylesheets';  #  与不同的站点有关


作為頁面CSS替代使用

此前有個 Extension:PageCSS（現已存檔），其使用 ‎<css> 和‎ ‎</css> 標籤而非#css:解析器函數。 此擴展可以完成PageCSS擴展提供的大部分功能，但語法不兼容。 避免破壞仍然使用舊的 ‎<css> 標籤的現有頁面的一種方法是在同一個wiki上同時使用 Extension:CSS 和 Extension:NewPageCSS。

另一個方案（如果你只想用這個擴展，但是已經有一些要求用 Extension:PageCSS 的內容）是保存這一小段函數為一個 PHP 文件，並且把它包含進你的 LocalSettings.php 來重映射 <css> 為 #css： 

<?php

//  Stub to remap <css></css> tags to {{#css:}} parser function extension

//  For use when installing https://www.mediawiki.org/wiki/Extension:CSS to replace Extension:NewPageCSS on existing wikis

$wgHooks['ParserFirstCallInit'][] = 'wfCSSParserStubInit';
 
//  Hook our callback function into the parser
function wfCSSParserStubInit( Parser $parser ) {

        //  When the parser sees the <css> tag, it executes the stub wfCSSTagRender function (below) to invoke the {{#css:}} parser
        $parser->setHook( 'css', 'wfCSSTagRender' );
        return true;
}
//  Execute <css> tag
function wfCSSTagRender( $input, array $args, Parser $parser, PPFrame $frame ) {

        //  Stub function, just redirect the user-provided input text blindly to the {{#css:}} parser function to re-parse it as wikitext
        $output = $parser->recursiveTagParse('{{#css:' . $input . '}}', $frame);
        return $output;
}

這樣，以前的 PageCSS（或者 NewPageCSS）擴展就能從你的配置中移除了； <css> 現在成了 #css: 而且（如果你已經上線運行這個 CSS 擴展）它的行為方式將與任何其他 CSS 擴展的相同。

改變特定頁面顏色或背景的問題

使用解析器函數使用另一個頁面的CSS不能夠用於改變頁面的顏色或背景，然而，使用解析器函數在頁面自身可以允許改變背景。 若要解決這個問題，通過嵌入來加載CSS，就不會導致無法改變頁面背景的問題。


漏洞

見 討論頁。

參見