Manual:Architectural modules/Skin
| Module | |
| Skin | |
| Responsibilities | Provides the possibility to customize the look of MediaWiki |
| Implementation | Skin is the core class in the Skin module, and the base class for the skins
|
Responsibilities
| File:Module-Skin-Inheritance1.svg | File:Module-Skin-Inheritance2.svg |
| Inheritance in Skin module | |
Skin module provides the possibility to customize the look of MediaWiki and it is responsible for the final rendering of the page. In the majority of cases the printing of the actual HTML code takes place inside this module. The default skin is 'Vector' and it is set by the variable $wgDefaultSkin. Wiki pages will be shown in this skin to all anonymous users and to those registered ones, who have not changed their preferences to other skins. Apart from 'Vector' skin, MediaWiki is shipped with 3 other skins: 'Cologneblue', 'Monobook' and 'Modern'. Furthermore, developers can write custom skins and use them on their MediaWiki.
Implementation Information
The core class in the Skin module is Skin. This is the base class for all other skins, that provides methods and properties for them. These methods generate HTML code for particular parts of the page. For example, it generates footer links for 'Privacy policy', 'Disclaimers' and 'About' that will look the following way (if the interface language is English and the name of the wiki is 'buildings'):
<a href="/buildings/en/index.php/Buildings:Privacy_policy" title="Buildings:Privacy policy">Privacy policy</a><a href="/buildings/en/index.php/Buildings:General_disclaimer" title="Buildings:General disclaimer">Disclaimers</a><a href="/buildings/en/index.php/Buildings:About" title="Buildings:About">About buildings</a>
| File:Module-Skin-VectorTemplate1.svg | File:Module-Skin-VectorTemplate2.svg |
| Example of vector template instance | |
The same way it generates HTML code for category links, copyright icon, logo text etc. For some future parts of the HTML page it does not generate the final code, but builds an array to represent this part, that will be properly transformed into HTML code later. For example, it does so for the side bar. Apart from described functionality, this class also fetches the names of all available skins, loads the required skin, gets the required modules for it and contains the abstract function outputPage(), that is implemented in SkinTemplate class.
SkinTemplate inherits from Skin as shown on left figure of Inheritance in Skin module block. It is the class for filling the template with necessary variables (key-value pairs). The generation of values for these variables is done either by Skin (as shown for 'Privacy policy', 'Disclaimers' and 'About'), by OutputPage (for head links, css links, page title, body text etc.) or by the SkinTemplate class itself (personal urls for user page, talk page, logout or content navigation urls for namespaces, actions on pages etc.). Some of the values for the variables are taken from global variables: $wgHtml5Version, $wgLogo, $wgSitename etc. The filling of the template takes place inside the outputPage() method (by calling prepareQuickTemplate(). When the template is filled and ready (an example of it can be seen on the figures Example of vector template instance, the execute() method is called on it.
The template, that is being filled and executed, is of class VectorTemplate (if we have 'Vector' as selected skin). VectorTemplate inherits from BaseTemplate, that inherits from QuickTemplate as shown on the right figure of Inheritance in Skin module block. QuickTemplate is a generic wrapper for template methods. It implements basic setters and getters for template variables and has an abstract method execute(), that is implemented by the custom template (in our case by VectorTemplate). BaseTemplate provides helper methods to interact with data stored in template.
The execute() method of VectorTemplate outputs the entire content of HTML page, that will be sent as a response to browser.
