GeezerVison

MediaWiki extensions manual

CSS Release status: stable
Implementation	Parser function
Description	Provides a parser-function for adding CSS files, article or inline rules to articles
Author(s)	Aran Dunkley Rusty Burchfield
Latest version	3.5.0
MediaWiki	>= 1.43.0
Parameters $wgCSSIdentifier
Hooks used ParserFirstCallInit RawPageViewBeforeOutput
Licence	GNU General Public License 2.0 or later
Download	Download extension Git [?]: Browse repository (GitHub) Gerrit code review Git commit log Download source tarball
Example	organicdesign.nz
Translate the CSS extension if it is available at translatewiki.net
Issues	Open tasks · Report a bug

The CSS extension allows CSS stylesheets to be included in specific articles. The CSS can be another article, a file or can be rules defined directly within the parser-function.

For example, if you have a CSS article called "MyStyles.css", which are the styles intended for use with the article "MyFancyUserPage", you would add the following parser-function syntax to the latter,

{{#css:MyStyles.css}}

If on the other hand "MyStyles.css" was a file in the /wiki/skins directory, then it would be included as shown below. Note that the file must be an absolute path with a leading slash to distinguish it from an article title.

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

Alternatively, CSS rules can be directly included within the parser-function (inline) as in the following example,

{{#css:
  body {
    background: yellow;
    color: red;
    font-size: 1.25rem;
  }
}}

• Download and move the extracted CSS folder to your extensions/ directory.
  Developers and code contributors should install the extension from Git instead, using:

  cd extensions/
  git clone https://gerrit.wikimedia.org/r/mediawiki/extensions/CSS
  

• Only when installing from Git, run Composer to install PHP dependencies, by issuing composer install --no-dev in the extension directory. (See T173141 for potential complications.)
• Add the following code at the bottom of your LocalSettings.php file:

  wfLoadExtension( 'CSS' );
  

• Configure as required.
• Done – Navigate to Special:Version on your wiki to verify that the extension is successfully installed.

Optionally, you can set the base URL for external files.

$wgCSSPath = false;  # Default, relative to $wgScriptPath
$wgCSSPath = '';  # Relative to the root of your server
$wgCSSPath = 'https://example.org/stylesheets';  # Relative to a different site

Changing the color or background of a specific page

Using the parser function to use the CSS from another page does not work to change the color or background of the page, however, using the parser function on a single page by itself does allow the background to be changed. 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.

• Extension:NewPageCSS
• Extension:TemplateStyles - a similar extension which sanitizes the CSS and stores it on separate pages.

This extension is included in the following wiki farms/hosts and/or packages: Miraheze MyWikis ProWiki Telepedia

• Stable extensions
• Parser function extensions
• ParserFirstCallInit extensions
• RawPageViewBeforeOutput extensions
• GPL licensed extensions
• Extensions in Wikimedia version control
• All extensions
• Extensions requiring Composer with git
• Extensions included in Miraheze
• Extensions included in MyWikis
• Extensions included in ProWiki
• Extensions included in Telepedia
• User interface extensions
• Script embedding extensions
• CSS

• Extensions without an image
• Extensions without a compatibility policy