Difference between revisions of "MediaWiki/Theming"
| Line 22: | Line 22: | ||
== How to make your own skin == | == How to make your own skin == | ||
| + | A skin generally has it's own directory, plus two setup files. | ||
| + | If you wanted to create a skin called 'Happy' you would have | ||
| + | <pre> | ||
| + | happy | ||
| + | Happy.php | ||
| + | Happy.deps.php | ||
| + | </pre> | ||
| + | in the 'skins' directory. | ||
| + | |||
| + | The easiest way to create your skin is to copy the monobook skin and start from there. | ||
| + | |||
You can create a skin all by yourself by following the steps provided below: | You can create a skin all by yourself by following the steps provided below: | ||
# Go to your mediawiki directory; | # Go to your mediawiki directory; | ||
| − | # Copy the monobook directory and name it with the name of your skin | + | # Copy the monobook directory and name it with the name of your skin: happy; |
| − | # Copy the MonoBook.php file and name it with the name of your skin | + | # Copy the MonoBook.php file and name it with the name of your skin: Happy.php; |
| − | # Edit | + | # Edit Happy.php and change the class name to SkinHappy: <source lang="php">class SkinHappy extends SkinTemplate;</source> |
| − | # In | + | # In Happy.php, change the template class to have your skin name together with the word 'Template': <source lang="php">class HappyTemplate extends QuickTemplate;</source> |
| − | # | + | # Also in Happy.php, make the references to the skin match the names: <source lang="php"> |
| − | + | function initPage( &$out ) { | |
| − | + | SkinTemplate::initPage( $out ); | |
| − | # In your | + | $this->skinname = 'happy'; // matches the physical directory name |
| − | # Edit and customise | + | $this->stylename = 'happy'; // matches the physical directory name |
| − | + | $this->template = 'HappyTemplate'; // matches the template class name | |
| + | }</source> | ||
| + | # In your happy directory edit the image and CSS files until your heart is content; | ||
| + | # Edit and customise Happy.php as you please; | ||
== Nice Examples == | == Nice Examples == | ||
Revision as of 08:29, 5 October 2008
You can change the look and layout of your Mediawiki site. The place to start is the wikimedia groups' meta pages.
There is the design document and the info on skins or just dive into all the examples of user styles
Contents
How to chage the Logo[edit | edit source]
You can change the Logo of the wiki by altering the $wgLogo variable in LocalSettings.php to the name of the image you want to use as a logo. Please note that this logo should be placed in the /skins/common/images/ folder.
$wgLogo = "$wgStylePath/common/images/freephile_sm_logo.gif";
How to change the favicon[edit | edit source]
You can change the icon that is displayed in the address bar of your browser by setting a value for $wgFavicon in the LocalSettings.php file
$wgFavicon = "http://www.freephile.com/images/logos/favicon.ico";
How to make your own skin[edit | edit source]
A skin generally has it's own directory, plus two setup files. If you wanted to create a skin called 'Happy' you would have
happy Happy.php Happy.deps.php
in the 'skins' directory.
The easiest way to create your skin is to copy the monobook skin and start from there.
You can create a skin all by yourself by following the steps provided below:
- Go to your mediawiki directory;
- Copy the monobook directory and name it with the name of your skin: happy;
- Copy the MonoBook.php file and name it with the name of your skin: Happy.php;
- Edit Happy.php and change the class name to SkinHappy:
class SkinHappy extends SkinTemplate;
- In Happy.php, change the template class to have your skin name together with the word 'Template':
class HappyTemplate extends QuickTemplate;
- Also in Happy.php, make the references to the skin match the names:
function initPage( &$out ) { SkinTemplate::initPage( $out ); $this->skinname = 'happy'; // matches the physical directory name $this->stylename = 'happy'; // matches the physical directory name $this->template = 'HappyTemplate'; // matches the template class name }
- In your happy directory edit the image and CSS files until your heart is content;
- Edit and customise Happy.php as you please;
Nice Examples[edit | edit source]
- http://en.opensuse.org/Welcome_to_openSUSE.org
- http://www.mono-project.com/Main_Page
- http://beagle-project.org/Main_Page
- http://en.opensuse.org/Welcome_to_openSUSE.org
- https://wiki.mozilla.org/Main_Page
I'm fairly certain without checking the wayback machine that developer.mozilla.org used to run mediawiki, with a nice theme. Now they are running a commercial opensource product.
Resources[edit | edit source]
The Layout Design Document might cover some relevant info, but a quick glance makes it seem that it's circa 2004.
The skinning manual http://www.mediawiki.org/wiki/Manual:Skinning is probably the most comprehensive and best introduction to how the skin system works aside from digging into the code in the 'skins' directory.
