Today, using my own MediaWiki skin as the basis, I altered it to make it look like the Rounded Blue Edition WordPress theme. It is available for download. Click here to go to the download page and view a small thumbnail screenshot of the Rounded Blue Edition MediaWiki skin. UPDATE 4/10/10: The new download location is http://code.google.com/p/roundedblue-mediawiki-skin/downloads/list.

To use it, just unzip it and upload it into your MediaWiki installation’s skins directory. The path to the stylesheet is relative: skins/roundedblue/main.css. Change the path if for some reason the stylesheet is not being applied. You’ll find the path in the roundedblue.php file, in the HTML head section, right underneath the title tag.

The Photoshop images that are used for the header background image, the rounded corner content boxes, etc. are available at itcouldbethisone.com for download.

You may need to do some further customization to get your logo to look right, if you have a logo in the upper left corner. Also, if you do not want to display the name of your site across the masthead, then remove the masthead div tag – and the h1 and h2 tags nested in it – from the roundedblue.php template. Your logo may not look good against the background image, either, so you may need to edit either your logo or the bg.jpg file, which is the image at the top in the background, to get the two images to look good together.

If you don’t want so much space at the top, edit the top margin values of the #content and the padding-top of the #column-one div tags in the main.css stylesheet. Keep in mind that it will make the background image at the top look “chopped off” at the bottom. So you’ll want to change this image, too. You will need to replace the bg.jpg image with an image that has less height.

UPDATE 2/18/07: Several people have privately emailed me regarding a bug in the layout. It breaks when pages are long. The quick and dirty fix is to make the csbbody-l.gif and csbbody-r.gif images taller. You can do that yourself now, making these images tall enough to suit your own content needs. The best fix is to use CSS for the the color and border of the rounded content box, using images only for the rounded corners. In my next version of the roundedblue and roundedsassy MediaWiki skins, I will use this more flexible method. If you want to be notified when the new version of either skin is available, I suggest you subscribe to the RSS feed for the wikis category in this blog. You will see an RSS link next to each category in the right sidebar.

UPDATE 3/18/07: When using the skin on MediaWiki 1.9.3 and viewing it in Internet Explorer 7.0, blocks of white partially cover some bullet point and main heading text. I’m working on fixing this.

UPDATE 4/10/10: I changed the images and CSS used to create the rounded content box for the main content. This fixes the problem of long pages breaking the layout. It also fixes the problem of the TOC breaking the layout.

NOTE 4/11/10: The CSS and image files that are used to generate the rounded boxes are now completely different than they were in the original version of RoundedBlue. To edit the image files for the latest version of RoundedBlue for MediaWiki, you will not be able to use the original PhotoShop files from the WordPress theme from itcouldbethisone.com. For tips on editing the image files that are used in the latest version of RoundedBlue for MediaWiki, please see this post.

UPDATE 4/13/10: In the latest version of MediaWiki, the portlets were being duplicated in the left column, and the footer was being crammed into the left column. I have updated the skin to fix the layout.

PLEASE NOTE 4/18/10: From now on, when I make changes to Rounded Blue, I will not be adding any more updates to my blog. I will be using the Google Code project site to keep track of issues and fixes.