Browse all the entries under Reviews, Wikis.

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.

UPDATE 4/18/10: In I.E. 8, extra white space was being inserted in the sidebar portlets. Thanks to Dan Zahlis for the CSS fix for this. The fix was to set the width of the navigation and toolbar portlets to 100% in a CSS file just for I.E. 8. The latest download of Rounded Blue contains this fix. Of course if you are using a language or custom sidebar portlet, you will need to edit the IE80Fixes.css file to add a CSS block for it.

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.

If You Need a Language Sidebar

For some reason, an empty language sidebar kept being generated, no matter what I did, so I had to remove the rounded box styling for the language sidebar. For users who need the language sidebar, find the following code in roundedblue.php:

if ( !isset( $sidebar['SEARCH'] ) ) $sidebar['SEARCH'] = true;
if ( !isset( $sidebar['TOOLBOX'] ) ) $sidebar['TOOLBOX'] = true;
foreach ($sidebar as $boxName => $cont) {
if ( $boxName == 'SEARCH' ) {
$this->searchBox();
} elseif ( $boxName == 'TOOLBOX' ) {
echo $begintags;
$this->toolbox();
echo $endtags;
} elseif ( isset( $sidebar['LANGUAGES'] ) && $boxName == 'LANGUAGES' ) {
$this->languageBox();
} elseif ( !empty($boxName) ) {
echo $begintags;
$this->customBox( $boxName, $cont );
echo $endtags;
}
}

Change it to:

if ( !isset( $sidebar['SEARCH'] ) ) $sidebar['SEARCH'] = true;
if ( !isset( $sidebar['TOOLBOX'] ) ) $sidebar['TOOLBOX'] = true;
if ( !isset( $sidebar['LANGUAGES'] ) ) $sidebar['LANGUAGES'] = true;
foreach ($sidebar as $boxName => $cont) {
if ( $boxName == 'SEARCH' ) {
$this->searchBox();
} elseif ( $boxName == 'TOOLBOX' ) {
echo $begintags;
$this->toolbox();
echo $endtags;
} elseif ( $boxName == 'LANGUAGES' ){
echo $begintags;
$this->languageBox();
echo $endtags;
} elseif ( !empty($boxName) ) {
echo $begintags;
$this->customBox( $boxName, $cont );
echo $endtags;
}
}

Editing the Image Files

The image files are sheet-c.gif, sheet-s.gif, sheet-h.gif and sheet-v.gif. All of these should be very easy to edit with the exception of sheet-s.gif, which is a circle. (It gets clipped by the CSS to generate each corner.) Just remember when editing gif files that if you want to change the colors, make the image mode RGB Color instead of Indexed Color while you are working on them. But then when you are done making your changes, change the image mode back to Indexed Color. To edit sheet-s.gif you will need to become adept at using the Elliptical Marquee Tool in PhotoShop (or its equivalent in whatever image editing program you use). With this tool, you can select the larger of the two nested circles and make it whatever color you want. Do this on another layer which you can then hide when you select the smaller nested circle. Otherwise the smaller nested circle will get covered up, and you will need to play around a lot to get it just the right size. But before selecting the smaller nested circle to change its color, select the inverse of the larger circle selection. Then make the background color whatever color you want. Then hide the layer you used to change the color of the larger nested circle. Then you will be able to see the smaller circle, select it and change its color.

Browse all the entries under Wikis.

Browse all the entries under Books, Web Design, Wikis.

The book follows my favorite format for a technical guide, taking the reader step by step through an example that resembles the kind of thing you’d want to do in real life. It breaks down everything thoroughly with plenty of pictures. Topics covered include not only CSS but also MediaWiki PHP functions that are integrated into a MediaWiki skin. As a bonus, there is information on adding on some of the latest widgets that Web 2.0 has to offer, from thickbox to twitter. To make your skin a real professional class act, you can even learn exactly how to use licensing and copyright options and exactly how to make your skin printer friendly. If you’re going to be spending any time messing with MediaWiki skin design, and you’re like me and don’t have time to spend hours spinning your wheels, do yourself a favor and get a copy of this book.

Browse all the entries under Books, Reviews, Wikis.

Browse all the entries under Web Design, Wikis.