Page MenuHomePhabricator

[Session] Get setup with MediaWiki and build a skin
Closed, ResolvedPublic


Session description

This session is aimed at:

  • beginners to MediaWiki who might not know how best to contribute to our ecosystem


  • any developer who is interested in seeing what's happened in the skin ecosystem.

A basic knowledge of CSS/HTML is required to participate in this session. No PHP knowledge necessary (but useful!)

In this session we'll help you:

  • get setup with a MediaWiki instance if needed
  • build a basic skin
  • understand how building skins has changed in the last 3 years
  • understand how to publish it to the MediaWiki ecosystem (if you want)
  • meet other developers building skins
  • provide input to the future of skins
  • Username for contact: @Jdlrobson
  • Session duration (25 or 50 min): 50mins
  • Session type (presentation, workshop, discussion, etc.): workshow
  • Language of session (English, Arabic, etc.): English
  • Prerequisites (some Python, etc.): CSS, HTML


Add your username below:

Event Timeline

Jdlrobson updated the task description. (Show Details)
Jdlrobson updated the task description. (Show Details)
jhsoby added a subscriber: jhsoby.
Quiddity updated the task description. (Show Details)
Quiddity added a subscriber: Quiddity.

Hello to everyone who expressed an interest!
To set some expectations this should be an informal and interactive workshop-like section depending on who joins! I'm hoping we'll hack on some skins in this session, but if you don't want to hack and just want to talk - that's also good. I'm also happy to talk about the new Vector 2022 skin as one of the developers of that project.

I will give a brief introduction to why understanding skins is important to MediaWiki development and then we will use the session to help individuals make skins or get setup with MediaWiki development. I'll share some tips for making skin development easier to developers and please come prepared to share your frustrations with skins currently so we can think about how we improve them. If you are an extension developer this is also a great opportunity to learn how you can make good features that work across skins and don't break with newer versions of MediaWiki.

If you want to come prepared, ideally you'd have a working instance of MediaWiki setup locally (but if you are struggling - don't worry we'll help you get that working!) It might also be helpful to get familiar with the following tools which we will use to make skins:

Looking forward to hacking with you all!

Subscribers: Please let me know here if there is something specific you want to get out of the session so that I can make last minute amendments to my session! Thanks in advance!

Session Notes:

Get setup with MediaWiki and build a skin

Date & time: Friday, May 19th at 11:30 am EEST / 8:30 am UTC

Relevant links


Jon Robson



Why should you care about skins?
its healthier if mediawikis look different
building a skin lets you learn about how things work
there could be extensions that dont work when you install a skin, helps you learn more
more diversity increases innovation, more people building cool features can be spread around
a good introduction to MediaWiki

Can I write a skin?
dont need PHP but do need HTML and CSS

Ways to build a skin

  1. use
  2. can use command line
  3. can clone a repo and then tweak it

How to publish a skin

give it a name
can mess around with the code
click the download button and it will create a zip file
Using the command line
npm install mediawiki-skins-cli

skin.less has the CSS in it to play around
the JS file is empty by defualt but you can add things
the template is in mustache

Where is the best documenation to understand the different components of the skin?
How to make a mediawiki skin

@Jdlrobson: Thanks for participating in the Hackathon! We hope you had a great time.

  • If this session / event took place: Please change the task status to resolved via the Add Action...Change Status dropdown.
    • If there are session notes (e.g. on Etherpad or a wiki page), or if the session was recorded, please make sure these resources are linked from this task.
    • If there are specific follow-up tasks from this session / event: Please create dedicated tasks and add another active project tag to those tasks, so others can find those tasks (as likely nobody in the future will look at the Hackathon workboard when trying to find something they are interested in).
  • In this session / event did not take place: Please set the task status to declined.

Thank you,
Phabricator housekeeping service

Thanks everyone for attending. Feel free to follow up with questions here if you have any.