Manual:Gallery of user styles

This page is a showcase of MediaWiki skins. None of these skins are maintained by the MediaWiki core team; if you find an error or wish to leave feedback, contact their respective authors.

Use the form below to create a new subpage to list details for your skin. Please add your skin to the appropriate gallery afterwards.

Monobook derived skins

Styles and positioning of page elements is stored in a file called main.css. To get to this file go to skins/monobook/main.css. Editing in CSS is fairly simple, once you figure out what each color and position corresponds to. This allows you to keep the MonoBook skin as the default, which is nice because it is well written.

If you want to put in Google ads or some other JavaScript program, you can do this in Monobook.php. You can actually edit any .php file's appearance by going to main.css in the appropriate folder/directory. If you only wish to change CSS or JS, its recommended that you use the MediaWiki:Common.css and MediaWiki:Common.js pages on your wiki whenever possible, as directly editing skin files can cause problems when upgrading.

• 

  Wikimini 1.0 is a nice example of how easy it is to produce your own customized MediaWiki web site.

• 

  Rounds some corners; makes buttons look nice;

• 

  Omegatron's Fixed Sidebar tries to copy the Classic skin's fixed sidebar.

• 

  Crom is a free monobook based skin for corporate use.

• 

  Simple iPhone, basic monobook skin for iPhone.

• 

  Hill

• 

  Monobrooke Simple and clean green layout.

• 

  iWiki is designed for Apple's iPhone, iPod touch, iPad and other mobile browsers, powered by jQTouch.

• 

  Paulgu's drop down menu is designed to look professional and maximize space.

• 

  Daddio is a skin for business wiki

GoMediaWiki skin

15.x

Original skin: Monobook
Author: GoMediaWiki.com
MediaWiki versions: Unknown

Skin with 3 color options - blue, red and green. Fits well for personal/group wiki. Tested mostly with MW versions 1.15, 1.16, and 1.18.2.

FratMan

Original skin: Monobook
Author: Jason Pearce
MediaWiki versions: Unknown

A light, minimalist theme.

For development, please see Google Code

Jason Pearce's FratMan skin is a light, minimalist skin that was first developed for MediaWiki v1.4 in April 2005. Others have updated the skin to improve browser compatability and work with MediaWiki updates. The latest skin, developed by Anand in September 2006, works with MediaWiki v1.7. Visit Jason Pearce's website to download all versions.

Karin

0.03pre-alpha Final

Original skin: StudentLink
Author: Robert E. Goodermote II
MediaWiki versions: Unknown

Updated November 23rd, 2009 - Karin (KaHrin) is a variant of the StudentLink skin by Andrew Tutt. It is for people who turned MediaWiki into a private wiki and is not for communities! This is a slimmer skin, features rounded (if on Firefox) bottom corners, lacks a sidebar and instead uses the top navigation for all your purposes. This will require you to change parts of the PHP as this skin is being archived as is from my website and are left untouched in all ways. This skin looks best when used in combination with The JQuery Tabs extension as it was built around them. You will need to manually add most javascript calls. Keep in mind this is being developed around my needs and in my environment this will have problems and may not work for you and you will need to change several things before you can seriously use this skin.

BluWiki's Simple Skin

Original skin: Monobook, Fratman
Author: Sam Odio
MediaWiki versions: Unknown

Based off of MonoBook & Fratman. Designed to dedicate as much space as possible to the page's content. Critical tools (Edit, Log out, & User Name/homepage) are in the top right. Everything else is at the bottom of the page in a "toolbox."

The BluWiki Simple Skin validates in XHTML and CSS, and has been tested in the latest versions of Firefox, Internet Explorer, Safari, & Camino.

• Designed for: BluWiki
• Author: Sam Odio
  • Comments welcome at http://sam.bluwiki.com/go/User_talk:Sam_Odio

KindofBlue

Author: jhoov
MediaWiki versions: Unknown

This skin is primarily based off of the Fratman skin, with a few elements of Redeye sprinkled in. I wanted a clean, simple, user friendly design without all of the extra whitespace that most skins come with. It works fine on MediaWiki 1.9 and has been tested in FireFox 2, IE6 and IE7.

Rounded Blue Edition

Author: Jennifer Elrod
MediaWiki versions: Unknown

This is an adaptation of Ghyslain Armand's Rounded Blue Edition WordPress theme to MediaWiki. It leaves most of the Monobook CSS intact. To use this skin, upload the following folders and files into your MediaWiki skins directory: the roundedblue folder, roundedblue.php and roundedblue.deps.php. Keep in mind that the path to the stylesheet is relative. It is skins/roundedblue/main.css. If the stylesheet is not being applied when you select this skin in your preferences, then change the main.css stylesheet path to fit the directory structure in your own MediaWiki installation.

To learn a few more details about how to customize Rounded Blue Edition for your own wiki, you may find this thread in the MediaWiki Users forum helpful.

The easiest way to customize the skin might be to leave the CSS/HTML/PHP intact (except for the background) and just change the pictures. The psd-files of the WordPress theme this MediaWiki theme is based on, might be helpful.

You may also wish to download the Coolvetica font that is used for the navigation, toolbox and search subheadings.

Note: I.E. 7 bugs fixed

Note: TOC bug, TOC creates gap in content area! UPDATE: Fixed 4/10/2010

The future development of this skin is now being hosted on Google code. All are welcome to participate in the Rounded Blue MediaWiki Skin project there.

Rounded Sassy

Author: Jennifer Elrod
MediaWiki versions: Unknown

This is a change in the color scheme of the Rounded Blue skin. It has no background image at the top, and so there is less space at the top. Other than that, the layout is identical. To use this skin, upload the following folders and files into your MediaWiki skins directory: the roundedsassy folder, roundedsassy.php and roundedsassy.deps.php. Keep in mind that the path to the stylesheet is relative. It is skins/roundedsassy/main.css. If the stylesheet is not being applied when you select this skin in your preferences, then change the main.css stylesheet path to fit the directory structure in your own MediaWiki installation.

For information on how to customize this skin, you may find this thread in the MediaWiki Users forum helpful. Even though it's about the RoundedBlue skin, most of the tips also apply to the RoundedSassy skin.

Note: I.E. 7 bugs fixed

You may also wish to download the Coolvetica font that is used for the navigation, toolbox and search subheadings.

Coolvetica Source: http://roundedblue-mediawiki-skin.googlecode.com/files/coolveti.zip

MistyLook

Author: Trevor Wennblom
MediaWiki versions: Unknown

MistyLook for WordPress converted to MediaWiki. From Sadish Bala's MistyLook theme for WordPress (v3.2) and MonoBook skin. Used in MediaWiki 1.9.3, tested in 1.6.8 up to 1.16.2 as well. Quick and dirty port, a few CSS-script modifications are needed for full compliance with newer versions of IE above 6.x (Firefox up to 3.6 will work by default)

Andy's AJAX / JavaScript Skin

Author: Andy Cook
MediaWiki versions: Unknown

So here it is. My first MediaWiki theme. I wanted to take the skinning to a new level. Therefore, I implemented several AJAX / Javascripts to the skin. First, I want to credit Toykilla for his work as this theme is based on his skin, a heavily modified version of the Monobook theme. Now, on to the changes/features:

Visitors can add pages to their "favorites".

• First, you’ll notice that the content boxes along the left side can be re-arranged. This is done using AJAX and is stored on the local computer so the order stays the same for future visits. Also, each box can be collapsed or expanded by clicking on the (+) or (-). This is based on the Docking Boxes (dbx) script.

• Next, I’ve added a feature called “My Favorites”. Basically, under the title of each page is a link that says “Add to favorites”, when clicking on this link, it will add the page to the left navigation box for easy access. The pages can be removed if no longer needed and the list is stored as a cookie on the user’s machine so they won’t lose it. This avoids any messy database functions. Also, there is a helpful javascript popup explaining this to your visitors. This feature is similar to a “shopping cart” script and was mostly coded by hand. There is some redundancy in the code so if someone feels like cleaning it up, feel free.

• Lastly, I have embedded a Google search box in the left navigation pane. This avoids having to add any extensions to your Wiki and makes for easy access to the search engine.

This skin was tested on IE and Firefox. So feel free, download it and please let me know what you think of it.

SnaggleTooth

Author: Leah Kubik
MediaWiki versions: Unknown

This skin was designed for:

• A professional look and feel
• Simple layout
• Menu access with minimal scrolling
• Maximum text width / viewing
• No fixed widths / absolute positioning

See http://heinous.org/wiki/SnaggleTooth for documentation and download details.

Classic derived skins

CSS based Tooltips -proof of concept-

Author: Taka
MediaWiki versions: Unknown

 

• For a demo see: User:Taka/Tooltips
• Requires adding: this code to your monobook.css or myskin.css

Features

• Enables the use of tooltips (see image) in Mozilla and Opera (does not work in Internet Explorer)
• Can't be used really, because it has some glitches, and what is worse: it shows the text of the tooltips in the print-version of the page.
• With a change to the common stylesheet and maybe some improvements it could be workable.
• Can be added to every stylesheet (not just standard.css)

MonoClassic

Author: Finlay McWalter
MediaWiki versions: Unknown

 

Features

• Smoother, simpler than regular classic (most boxes and lines are gone, replaced with space).
• Incorporates a cool gray look and a modified version of monobook background, while retaining classic's nice UI and readable fonts.
• Works great on Opera and Firefox. Tiny glitches on IE.
• Fixes classic's horrible image flow issue (when compared with Monobook) - adjacent rfloat images now stack vertically rather than horizontally.

MySkins derived skins

ltrMenuPlus

0.5

Author: A. Bilardi (skinner) and M. Bettella (design)
MediaWiki versions: Unknown

Skin with any bars: public sidebar Left, Top bar, sidebar Right and private sidebars Left,

Top and sidebars Right. Each bar has got an MediaWiki page as original MonoBook MediaWiki:Sidebar.

Skin in action at http://genomics.cribi.unipd.it/ and http://microcribi.cribi.unipd.it/.

To install this skin, download the compress file into the "skins" folder of your wiki installation and unzip or tar it. Then edit in

LocalSettings.php $wgDefaultSkin to look like the following: $wgDefaultSkin = 'ltrmenuplus';

Nullbook

Author: SamatJain
MediaWiki versions: Unknown

An article with NullBook

I do not like Monobook; I feel as if it wastes too much space on the screen, is difficult to read, and doesn't follow established web usability guidelines. Behold NullBook:

• Fixed-position "tab bar", set to use GUI colors, that stays with you as you scroll down a page. The tab bar contains the contents of the "Views" menu, as well as the go/search box.
• No font size definitions; uses your browser's default. Skin (mostly) scales well with font size changes.
• Underlined links, and more recognizable link colors. Blue for unvisited links, purple for visited links, and green for broken (or uncreated) links. Moving over a link highlights it to red.
• Removed sidebar to stop wasting vertical screen real-estate, and relocated it to the bottom of the page. Also hid the other languages list since I tend to only look at English Wikipedia articles.

To use Nullbook, first set your Wikipedia/MediaWiki skin to "MySkin". Then, in myskin.css, add:

@import "http://en.wikipedia.org/w/index.php?title=User:SamatJain/myskin.css&action=raw&ctype=text/css";

Notice that NullBook requires a CSS2 browser (e.g. Mozilla Firefox, Opera, not MSIE6).

Also, see my blog post about Nullbook.

Chick derived skins

TabletChick

0.1

Author: yaniv256
MediaWiki versions: Wikipedia

Based on the highly readable Chick skin, this light-weight skin is designed primarily for use on a tablet device. Similar to the Nullbook skin, it includes a bar at the top with a search box and all the regular tabs. In addition, the personal links have been placed at the bottom and the toolbox links at the bottom-right. The Atom, File upload, Permanent link, Rate this page and Cite this page links have been removed.

To use paste

@import "http://en.wikipedia.org/w/index.php?title=User:yaniv256/TabletChick.css&action=raw&ctype=text/css";

into your User:YourUserName/chick.css file.

Original skins

Cavendish

1.6.4

Author: DaSch
MediaWiki versions: 1.18 and newer

This skin is a reworke of the skin formerly used at wiki.mozilla.org. It has been modified to work better with new versions of MediaWiki. The newest version is used at www.wecowi.de. The development is not finished yet. There will be new versions of this skin in future, so stay in touch. The current version is working with Firefox, Safari, Opera, Chrome, IE7 and IE8. IE6 was not tested but it's likely not working completely.

The skin was mostly developed for the newest trunk-version of MediaWiki. For this version all features are supported.

Sourcecode and latest version at github.com. More info at Skin:Cavendish.

Version notes

• 0.9.2: works with MW 1.15.1
• 0.9.5: Some bugs were reported, but could not be verified yet.
• 1.2.0: big rework and uses many elements from MonoBook skin, so that it should be compatible to most MW Versions.
• 1.3.1: was tested with MediaWiki 1.16.5 and 1.17.0 and 1.19alpha.
• 1.3.3: bugfixes and added support for MediaWiki 1.15
• 1.3.6: bugfixes and added option for Google +1 button
• 1.5.0: Droped Support for older Versions of MediaWiki and cleaned code
• 1.6.0: Cleanup of old compatibilties
• 1.6.1: print.css improved
• 1.6.3: print improved and QR-Code added to pront page
• 1.6.4: small improvments

Configuration options

There are different options for the skin that can be set in LocalSettings.php

• $cavendishLogoURL – link to the logo that should be displayed in the header
• $cavendishLogoWidth – width of the logo as a number in px
• $cavendishLogoHeight – height of the logo as a number in px
• $cavendishLogoMargin – offset on top of the logo
• $cavendishSiteWith – fixed width of the content area, if not set it's dynamic
• $cavendishExtensionCSS – set this to false if you do not want to use Cavendish CSS for Extensions

Cavendish-MW

0.3.2

Author: Serrano Pereira
MediaWiki versions: 1.21

Cavendish-MW (previously Cavendish mod) is a MediaWiki skin that provides the mozilla.org look and feel. It's an enhanced version of the Cavendish MediaWiki skin. The original Cavendish MediaWiki skin has some flaws and is not compatible with the latest versions of MediaWiki. Cavendish-MW fixes these issues and has other improvements like a full width template and updated style sheets. The JavaScripts have been fixed as well which makes neat stuff like Collapsible Tables/NavFrames/MediaWikiSuggest/etc. work.

Wolfbane

0.75

Author: Stinkfly
MediaWiki versions: Unknown

This is a skin made by Stinkfly at Wikia to hopefully be made as one of Wikia's skins. You can see some screenshots at CentralWikia:User:Stinkfly/Skin. Wolfbane skin has a very nice style in my opinion. Unfortunately, this skin seems no more mantained by original author (Stinkfly), so I made a derivated version. The screenshot is related at this modified version. Download Wolfbane modified version

Drone

0.1

Author: Chochem
MediaWiki versions: Unknown

A magazine-column-style skin with a clean and inviting look, equally inspired by the economist.com and last.fm designs. The simple, no-nonsense layout ensures greater focus and readability. Use of the Droid Sans font is recommended for best results. Feedback goes here. Released under the GPLv3.

Wikinews

Author: Noclip
MediaWiki versions: Unknown

Read the whole story about this skin here.

RilPoint

0.9.1

Author: Samuel Lampa
MediaWiki versions: 1.16.x

A Sharepoint look-alike skin, perfect for intranet and portals as well as community websites. The same skin is available as a Drupal 6 theme, which makes a perfect combination for integrating the look and feel of Drupal and MediaWiki-sites that run in combination.

ScreenRealEstate

1.0

Author: TI
MediaWiki versions: Unknown

This skin is inspired in look and feel by, and built upon Drone. However I did not like the toolboxes and navigational section hogging up the left of the screen: this makes the whole body of the article lose out on ScreenRealEstate. I have retained only the navigational links and menus which I use. Some are dropdown, some are inline. The search buttons are gone, only the box remains. A few ugly hacks, but dunno if I will get around to smoothing them.

WPtouch

Author: Dale Mugford & Duane Storey (BraveNewCode) / Modified for MediaWiki by Dan Flores
MediaWiki versions: Tested with 1.12 - 1.18 (may work with earlier and later versions)

A skin which formats your wiki with a mobile theme for the Apple iPhone / iPod touch, Google Android and other touch-based smartphones. More information

Download for MediaWiki 1.17 and earlier
Download for MediaWiki 1.18 and later

Download for MediaWiki 1.18 and later (Alternate version)

MW	Status	Description
1.20.2		WPtouch_1.18_and_later.zip + mediawiki-1.20.2.tar.gz ((atyu30) 22:55, Fri Dec 21 2012 (UTC)

Pixeled

Author: Sam / Modified for MediaWiki by Dan Flores
MediaWiki versions: Tested with 1.12 - 1.18 (may work with earlier and later versions)

Dark skin with 2-3 column layout. Enjoy! More information
Download for MediaWiki 1.17 and earlier
Download for MediaWiki 1.18 and later

Monaco (port)

[[File:|180px|right]]

Author: Inez Korczyński, Christian Williams, Piotr Molski, Daniel Friesen
MediaWiki versions: Unknown

A port of the Monaco skin, which was developed and made popular by Wikia.

WordPress TwentyTen

Author: The WordPress team (ported to MediaWiki by Sam Wilson)
MediaWiki versions: 1.18.3

The TwentyTen theme for WordPress ported to a MediaWiki skin. Download on GitHub. Replace tooltipAndAccesskey with tooltipAndAccesskeyAttribs in twentyten.php to get it to work with 1.19

The Erudite MW

A newer version of this skin is at Skin:Erudite.

0.9.0

Author: Matt Wiebe (ported to MediaWiki by Colin Ferm)
MediaWiki versions: 1.16.x

WordPress Erudite theme ported to work with MediaWiki. You can find out more information here along with a screenshot.

Nimbus

2.0

Author: Aaron Wright, David Pean, Inez Korczyński, Jack Phoenix
MediaWiki versions: 1.18+

See the Nimbus skin page for more information on the skin, including how to download it.

Victoria

0.0.1a

Author: FreedomFighterSparrow, Kol-Zchut Ltd.
MediaWiki versions: 1.17

A skin focused on readers, not editors, in soothing hues of blue. See the Victoria skin page for more details

Minit

1.0.0

Author: Seong Jae Lee
MediaWiki versions: 1.18+

A minimalistic skin for a personal wiki. For more information, refer the GitHub site.