Css for categories

Jump to: navigation, search

Hello mediawiki people,

mediawiki version: 1.16.2 mysql version: 5.1.45 PHP version: 5.2.13 url (just testing purposes): http://www.mediawiki.byethost7.com/mediawiki-1.16.2/index.php/Main_Page

I tried irc, but I guess for some reason I am not able to get an answer, so here I am.

I made my skin for mediawiki, but now I want to have categories, and for each page in that categorie to implement it' own css, like, all pages under category 'foo' should have h1 blue, and all pages under category 'bar' should have h1 yellow. (css itself will be much more complex, this is just an example)

I was surprised that nobody uses this, and the only thing I could find was this: http://www.mwusers.com/forums/showthread.php?4519-Applying-CSS-to-individual-categories. but it is old and no one has answered it...

Any help is appreciated and welcomed!

Thank you

Kind regards, Seiduna

Seiduna16:54, 2 April 2011

The page title is encoded as a CSS class of the body element. So, you can use body.page-Category_Foo h1 { color: blue; }

-- Bryan (talk|commons)20:08, 2 April 2011
 

It could be a little tricky, as pages can have more than one category, so depending on which order you list categories in your CSS file, pages may have a surprising color. For instance, you might have a CSS page something like:

  • in category foo color = blue
  • in category bar color = red

Page with category bar & category foo = red (bar comes after foo in the CSS file). If you had math pages as one color and music pages as another color, well, there might be something like a pi song that should be in both the math category and the music category:

Diatonic pi.ogg
Banaticus03:02, 4 April 2011
 

Hello guys, and thank you for your prompt answer!

The code Brian provide works nicely (THANK YOU BRIAN!), but just for main category page... On Test site (link in first post) you can click on LABORATORIJ link (top left) and h1 and h2 are correct (white background and red font), and in that category I have 2 pages, and as I click on either, the css does not kick in... (as, it should be red font on white background [correct], instead it is black on black[which is wrong]). So I need all the pages in that category to have h1 and h2 red on white... I am not a native english speaker, so I might express my self wrongly...

Banaticus, khaha, is that the song of PI? nice... Yes I read that a page might belong to different categories, so I'll keep an eye on that one, so that one page belongs just to one category. Thank you for heads up!

Is there a piece of code that I am missing, to have the same css for all pages that belong to one category ?


Thank you

Seiduna14:27, 4 April 2011
 
Personal tools

Variants
Actions
Navigation
Support
Download
Development
Communication
Toolbox