MediaWiki Skins by Castley

Posted byjasonpearce 58 Comments on MediaWiki Skins by Castley
2006 September 23: Anand released a new FratMan skin that works well with MediaWiki v1.7. The skin incorporates many of the changes suggested in these comments. Thank you Anand.

Robert Castley, Mambo project director from 2002 to October 2004, dropped in to thank me for the MediaWiki skins I created and to offer a few enhancements of his own.

Thanks for sharing your enhancements Robert. More so, thanks for all you have contributed to the open source community. I’ll need to create 1,000 skins or more to repay the dept I and others owe to you.

58 replies on “MediaWiki Skins by Castley”

  1. the Enhanced skin 1.5 works great now on MediaWiki 1.5. Except that on IE 6.0 the links on the left side are beginning at the very top (where the image is). I fixed it with removing the following block in the IE60Fixes.css

    p-cactions li a {

    display: inline-block !important;
vertical-align: top;
padding-bottom: 0;
border: solid #aaa;
border-width: 1px 1px 0;

    }

  2. seems the code doesn’t maked it well in this blog ^^ its the part starting with “p-cactions li a”

  3. seems the code doesn’t maked it well in this blog ;) its the part starting with “p-cactions li a”

  4. Update: You have to remove the “#column-content #content” “#column-one” “#footer” and the “#p-cactions li a”

  5. Hey, nice work, this skin hat a lot more air in it – I like that!

    I have an amendment to post for the amendment above which did not work on my site directly. If You get a weird display in IE6 using the hack above, try leaving the block “#column-content #content” in place, adjusting the margin-left a little to: “margin-left: 14.5em;”.

    That worked out for me …

    Keep up the good work! Thorsten

  6. Nice work with this skin. One problem I’ve had is that indented text (ie formatted with a :) does not show up indented. Also definition lists don’t seem to format correctly. I’m not sure if this is a CSS issue, or something with the PHP? It shows up in firefox, and safari on the mac and IE6 and firefox on windows. Any ideas? Thanks!

  7. Carl, it’s certainly a CSS issue. If it works in most browsers but not one specifically (in your case IE/win), then the CSS code is there, but a particular browser doesn’t understand it for some reason.

    I’m spamped building a new WordPress skin right now. I’m sure when I need a new wiki site, I’ll use the new v1.5 and will work on enhancing this skin further.

  8. I realize this is probably a dumb queston, but I’ve spent hours trying to figure out how to install this skin! If you have a moment, would you be able to give a quick overview of the steps necessary to fit this into a MediaWiki installation while still keeping the default Monobook skin as an option. I’m using 1.5. Thanks!

    John

  9. Very nice work with the skin, not so nice with the server configuration, I went trough hell to download the rar-package to one of my linux-servers using wget. Anyhow I managed to succeed by tweaking the parameters and telling wget to identify itself as firefox.

    I surf using this windows-laptop and download stuff directly to appropriate server trough ssh-terminal, so your attempt to prevent downloading with wget was just awful for users like me.

  10. Hi folks again,

    still, it’s a great skin to have for Your wiki – another minor change makes it work neatly with Safari and Konqueror, just change the only line in KHTMLFixes.css

    to

    “column-content { margin-left: 12px; }”

    and there You go …

    You may have a look at my site working with the skin (just some minor enhancements): https://www.projekt.editionswissenschaft.net

    Greets, Thorsten

  11. Yeah, I had the wget problem also. I ended up downloading it on my windows machine and scp’ing it to my server.

    The skin seems to be totally broken in Safari on the mac… anyone else have this problem?

  14. This seems strange … on https://www.projekt.editionswissenschaft.net it works for Konqueror and today I received another feedback it works for Safari, too. Please warn me if that’s not true under all conditions!

    Did You really make the change in KHTMLFixes.css? Maybe You need to clean up Your browser cache once more to see the result …

    (“All the text is overlying itself…” probably means: the main content column overlaps the left navigation, correct?)

  16. I didn’t test this (don’t have IE5 and 55 here …) idea out, but there are two files in the skins-dir, where You could try applying the same changes as described for the IE6-bug above: IE50Fixes.css and IE55Fixes.css Maybe that works?

  18. I’ve got the layout working good in IE6.0 but how on the left column the bullets under “Views” are spaced farther apart than the rest. Where can I change this so they all look uniform?

  19. I’ve also been having problems getting the layout to work properly in Safari. I’ve made the margin-left change to KHTMLFixes.css, but the main content column is still overlapping the left navigation. Looking at the page source in Safari, it looks like the KHTMLFixes.css header link is commented out.

  20. Wait, that’s not right. The IEXXFixes.css header links are commented out, and it doesn’t look like there is a header link to KHTMLFixes.css.

  21. I’ve gotten it to display properly in Safari by changing KHTMLFixes.css to:

    “column-content { margin-left: 200px; }”

    Alternately, just removing that line entirely may also work.

    But I’m not sure whether either of those changes would break things other KHTML browsers.

  23. (Sorry for the cross-post…)

    I have a floating problem in IE 6 for PC. The left sidebar floats to the top. I tried the changes to the IE 6 CSS file as suggested in the earlier post. But it hasn’t helped.

    Has anyone come up with any new ideas on how to solve the IE 6 sidebar float?

  24. I have a floating problem in IE 6. The left sidebar floats to the top. I have read the logs here and I looked at the sites that use this skin and compared to mine. I do not see much of a difference, so I am stuck. The problem seems to be related to IE6, it works fine in Mozilla FireFox.

    I tried the changes to the IE 6 CSS file as suggested in the earlier post. But it do not make any difference, I tried all the usggestion made in this blog.

    Has anyone come up with any new ideas on how to solve the IE 6 sidebar float?

    You can see for your self how it looks like on my website at http://www.epnn.com

  25. I solved the IE60 problem, by commenting only the #column-one section:

    like this: /* #column-one { position: absolute; top: 0; left: 0; z-index: 4; } */

    IE6 has an issue with drawing a rectangle around the navigation links though… anyone else who experiences this?

  26. update: actually simply deleting the IE60fixes.css file solves that issue… strange…

  28. Hi, I found an error on MediaWiki 1.6+ (CVS version) in function wfnomsg(). It goes as read:

    Fatal error: Call to undefined function: wfnomsg() in /(here comes the path)/MonoBook.php on line 130

    Do you guys have any idea?

  29. Ok, I found out by just comparing both monobook.php (from this skin to the original CVS version) and I realise that they changed this function to other one called wfEmptyMsg. So, here’s the fix:

    Find, line 130 (or near that): if (wfNoMsg($bar, $out)

    And put in place if (wfEmptyMsg($bar, $out)

    It should work fine now. I would put a new download link at the top page too, since it’s going to be the new version soon.

    PS – It’s for the “Enhanced skin (v1.5) by Castley” one.

  30. Hi everyone – there is one problem that I just cannot seem to fix, and I have been toiling over this for at least 2 weeks….this skin works fine for me, except when it comes to category pages. When you have a category, it lists all of the article links under it with some kind of “middle” alignment rather than “top” aligned. I must have done trial and error work on every possible line in the code that could potentially cause this to happen, but NOTHING fixes it. It is frustrating to the highest degree…if anyone knows how to fix this, PLEASE let me know!

    For example, this is what it looks like: https://i3.photobucket.com/albums/y87/markn26/example1.jpg This is how I want it to look: https://i3.photobucket.com/albums/y87/markn26/example2.jpg

  31. Pingback: Jason Pearce | relatively irrelevant » Blog Archive » Creative Commons and Permission

  32. A very nice work !

    I don’t know If I am going to ask too much here but can you tell me what to modify in the script / skins so that all article functions (view / edit / discussion / edit / history) could be bring back at the top of the article / page (like the default skin in Mediawiki). I find it more usefull in terms of editing stuff.

    thanks

  33. I Really like these skins. I’m using the Castley 1.5 version. I’ve applied both the suggested IE60Fixes.css changes and the KHTMLFixes.css changes. There’s one addition to throw in – it appears that images with center alignment do not align to the center. I added the following to the images section in main.css

    div.floatnone, table.floatnone { float: none; position: relative; margin: 0 0 0.5em 0.5em; border: 0 /* margin: 0.3em 0.5em 0.5em 0; border: 0.5em solid White; border-width: 0.5em 1.4em 0.8em 0; */ } .center { width: 100%; text-align: center; } *.center * { margin-left: auto; margin-right: auto; }

    The floatnone may be unecessary – but I noticed there was no css for it. The center stuff is copied from the original 1.5 monobook main.css – adding this makes images center for me.

  34. You can fix the definition lis issue by including the following lines in main.css. Stick them in the lists section.

    dt { font-weight: bold; margin-bottom: .1em; } dl { margin-top: .2em; margin-bottom: .5em; } dd { line-height: 1.5em; margin-left: 2em; margin-bottom: .1em; }

  35. I deleted IE60Fixes.css and replaced with a new IE60Fixes.css containing the following: Works well from what I can see. I don’t like the left margin when you simply delete the CSS file, so that’s why where this comes in.

    column-content {

    float: none; 
margin-left: 15em;
height: 1%;

    } column-one {

    position: absolute;
top: 10em;
left: 1em;
z-index: 4;

  36. I implemented this skin and created my own left navbar. But the stuff under the left navbar is missing (including the edit/discussion text on the bottom) when I view the site on IE6. But it is visible on Firefox 1.5.

    Like the others, I deleted the IE60fixes.css to solve the problem of the left navbar moving to the top of the bar.

    Any ideas? Here is my site:

    https://www.anglopedia.ca

    Here is the end of the navbar code and the start of the search box and stuff that is supposed to appear below…

    […]

    </div>

    <div class="portlet" id="p-personal"> <h5><?php $this->msg('personaltools') ?></h5> <div class="pBody"> <ul> <?php foreach($this->data['personal_urls'] as $key => $item) { ?><li id="pt-<?php echo htmlspecialchars($key) ?>"><a href="<?php echo htmlspecialchars($item['href']) ?>"<?php if(!empty($item['class'])) { ?> class="<?php echo htmlspecialchars($item['class']) ?>"<?php } ?>><?php echo htmlspecialchars($item['text']) ?></a></li><?php } ?> </ul> </div>

    </div>

    <div class="portlet" id="p-logo"> <a style="background-image: url(<?php $this->text('logopath') ?>);" href="<?php echo htmlspecialchars($this->data['nav_urls']['mainpage']['href'])?>" title="<?php $this->msg('mainpage') ?>"></a> </div>

    <script type="<?php $this->text('jsmimetype') ?>"> if (window.isMSIE55) fixalpha(); </script>

    <?php foreach ($this->data['sidebar'] as $bar => $cont) { ?> <div class='portlet' id='p-<?php echo htmlspecialchars($bar) ?>'> <h5><?php $out = wfMsg( $bar ); if (wfNoMsg($bar, $out)) echo $bar; else echo $out; ?></h5> <div class='pBody'> <ul> <?php foreach($cont as $key => $val) { ?> <li id="<?php echo htmlspecialchars($val['id']) ?>"><a href="<?php echo htmlspecialchars($val['href']) ?>"><?php echo htmlspecialchars($val['text'])?></a></li> <?php } ?> </ul> </div>

    </div>

  37. Can anyone please tell me how to change the size of Table of Contents? I mean there is too much space around it.

    Thanks!!!

  38. What would I need to change to make the title bar/image a clickable link to bring back to the main page?

    It seems like a simple edit… no?

  39. What code is necessary to add to the head section in order to import the IEMacFixes.css, KHTMLFixes.css, Opera6Fixes.css, and Opera7Fixes.css when viewed using those browsers? Currently the if conditions are only testing for IE:

    [if lt IE 5.5000]… [if IE 5.5000]… [if gte IE 6]… [if IE]…

    I don’t understand what variable those if statements are testing on, or what values to add for non-IE browsers. Can anyone help? I would like to import a CSS fix for Safari (KHTMLFixes.css?) since I am getting the same column overlay issue as described above but don’t know how to have the file KHTMLFixes.css imported when Safari is used as the browser. Can someone please explain this and/or provide the lines of code needed?

  40. Hi we use this skin in a wiki https://www.tnldp.org Take a look at the wiki, the main part of the site floats into the sidebar. :( We have troubles getting the skin to work with konqueor, does enyone else have/had this problem…? The wiki works fine in every other browser we have tested.

  41. There is a problem for the current version of mediawiki. The problem is important because it breaks the navigation menu and (thank god!) issues a nasty error message.

    Line 130 of MonoBook.php makes a call to a function

    wfNoMsg

    which have been renamed to

    wfEmptyMsg

    as explained on

    https://mail.wikipedia.org/pipermail/mediawiki-cvs/2005-September/011093.html

    The fix is really simple, even a matter of search and replace if you don’t want to find the spot ;)

    BTW — thank you for the nice theme! I like it a lot! The only thing I miss is there is no “flower” to click, it is part of the background image (which is very nice), and I used to click it to go “home”. I think it would be great if the flower as a different object, so people would have the ability to replace the flower with our transparent logo and also having the usual link to go the main page.

    Thanks! Cheers everybody!

  43. What is the fix for the table of contents? It appears too big. The frat mat site is fine, but the .rar file isn’t.

  44. guys, question : how do i create a link to the home page from the logo? Right now its’ a single image all the way across the top…

    thanks, AJ

  45. also, is there a way i can re-organize my left panel? … right now its’ Views , personal tools, navigation tools and search box. I’d prefer to have it navigation tools, search box , views and lastly personal tools…

    thanks, AJ

  46. Hooray, what a nice skin, and appears to work on FireFox and IE6.0

    I installed the 1.5 version on MediaWiki 1.6.3 and found a few bugs – fixed thanks to the above posts which i’ll quote here:

    There is a problem for the current version of mediawiki. The problem is important because it breaks the navigation menu and (thank god!) issues a nasty error message.

    Line 130 of MonoBook.php makes a call to a function

    wfNoMsg

    which have been renamed to

    wfEmptyMsg

    I deleted IE60Fixes.css and replaced with a new IE60Fixes.css containing the following: Works well from what I can see. I don’t like the left margin when you simply delete the CSS file, so that’s why where this comes in.

    column-content {

    float: none; margin-left: 15em; height: 1%;

    } column-one {

    position: absolute; top: 10em; left: 1em; z-index: 4;

    I’m excited!

  47. Hey Man, is the table of contents fixed with Skin 1.5 on Mediawiki 1.6.3?

  48. I’m not really sure why the table of contents is behaving the way it is, but adding this to main.css helps (a bit):

    toctitle h2 {

    font-size: 14pt; margin: 0; padding: 4px; }

  49. with version 1.6.8 i receive the follwing error in the Navigation section:

    Warning: Invalid argument supplied for foreach() in /wiki/skins/MonoBook.php on line 172

    Any Hints?

    Can someone supply all fixed files as a new3 archiv? This would be great. I think this is one of the finest skins for MediaWiki. Thanks a lot!

Comments are closed.