Extension:CSS
CSS Release status: stable |
|
---|---|
Implementation | Parser functions |
Description | A parser-function for adding CSS files, article or inline rules to articles |
Author(s) | User:Nad, Rusty Burchfield |
Last version | 3.1 (2012-01-15) |
MediaWiki | 1.16.x and above |
License | No license specified |
Download | |
Check usage (experimental) |
This 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.
Contents |
[edit] Usage
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; font-size: 20pt; color: red; } }}
[edit] Installation
Download the latest snapshot and extract it to your extensions directory. Then include it in your LocalSettings.php file as in the following example.
require_once("$IP/extensions/CSS/CSS.php");
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 = 'http://example.org/stylesheets'; # Relative to a different site
[edit] Use as a PageCSS replacement
There is a prior Extension:PageCSS which used <css> and </css> tags instead of the #css: parser function. This extension can do most of what those extensions provide, but the syntax is incompatible. One way to avoid breaking existing pages which still use the old <css> tags is to use both this Extension:CSS and Extension:NewPageCSS on the same wiki.
An alternate solution (if you want to use only this extension, but have existing content which expects Extension:PageCSS) is to save this stub function as a PHP file and include it from your LocalSettings.php to remap <css> to #css:
<?php // Stub to remap <css></css> tags to {{#css:}} parser function extension // For use when installing http://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; }
At this point, the prior PageCSS (or NewPageCSS) extensions may be removed from your configuration; <css> now goes to #css: and (if you have this CSS extension already up and running) will behave the way any of the other CSS extensions always have.
[edit] Bugs
See talk page.
[edit] See also
- OrganicDesign:CSS example - a usage example of this extension
- Extension:PageCSS - on-page CSS styles
- Extension:NewPageCSS
- Extension:AddScriptCss - a similar extension which allows stylesheets to be added from file