01

Jan

2007

MediaWiki skin ycgu max 2.0 is released

Here is the new features of this new skin:
Release notes

  • Categorized CSS files by functionalities, style, and templates, very easy to read and edit.
  • Documentation – Very detailed comments for important tags.
  • Performance – Greatly improved performance by reducing size and number of pictures.
  • Improved compatibility with Internet Explorer by changing the format of pictures.
  • Title has a nice title icon.
  • Easily switch to your logo by adding $wgLogo in LocalSettings.php.
  • Absolute positioning inside of the body area.
  • Compatible with AJAX search in MediaWiki.
  • Fixed wrap problems in both IE and Firefox.

You are welcome to download from my main website paulgu.com.

Any comments, questions, or problems about this release, please post on MediaWiki Skin

25 Responses

  1. Baba says:

    Great skin. I commented on the skin talk page but I just saw your blog here. Very clean, I like your work very much. Looking forward to future updates.

  2. Paul says:

    Thanks you. My approach is making the clean and neat skin, but it will still contains all the Wiki functionalities. It’s hard according to the common user interface guidelines because there are so many menus. I highlighted the most important menus and make them easy to access, also give the Wiki a great look.

  3. George says:

    Yes, they look good.
    I like the version of the skin that you are currently using.
    Will you release that version soon?

    Thanks!

  4. Paul says:

    Yes, as soon as I think it’s good to be used, and that will be v3.0.

  5. dryas says:

    hi i’ve just deployed your skin ( 2.0 )on my website.
    first thks for your great job. your skin is formidable

    After a few week i encounter two littles bugs.

    1
    when i select “mes préférences” (my preference), the first display of the sub menu have a wrong absolute position.

    2
    the form for creating an account is invisible.
    the error message for a bad password is invisible too

    I must say that i know wiki since 2 weeks so i m a noob.

    excuse me for my very bad english…

    dryas

  6. Paul says:

    Thanks Dryas,

    Some other users report this too. It only happens in Internet Explorer. Everything works fine in Firefox.

    For the version 2.0, I don’t have the MediaWiki 1.8.2 to test, but you can try to download this patch to see if it works. It hasn’t been tested, but you can give a try

    Click on here to download the patch.

    This patch may fix the login and create account for Internet Explorer, but it doesn’t fix the positioning.

    Right now, I switched to MediaWiki 1.9.0, and I’m working on the my next skin for this MediaWiki release. I will try to fix those problems that you have addressed in version 2.0

  7. Paul says:

    For positioning, I had figured it out.

    Because the IE doesn’t like the tag “position: relative;”, but Firefox works fine with it.

    You can find the following section in _ycgu_template.css

    #mBody {
    position: relative !important; /* content positioning, except IE */
    position: relative; /* content positioning for IE */
    z-index: 2;
    clear: both;
    padding: 0;
    margin: 0;
    }

    Change the second “position: relative;” to “position: none;”. This may affect some other positioning problem in IE, and I hope you will be able to find and fix it.

    I had fixed all those issues in my next release.

  8. dryas says:

    thanks you!!!

    it s working fine now, i’m impatient to see your next release 😉

    happy new year to canada from france!!

    dryas

  9. Paul says:

    You are very welcome, and same to you too :).

  10. Paul Gu says:

    If your MediaWiki version is under 1.6.8, it doesn’t work because of an extra function calls.

    Kai Brinker had fixed it by doing following:

    It works fine for me on 1.6.7 after I removed line 81ish of gumax.php, which calls to makeglobalvariablesscript(). I have to wait for my host to update to PHP5 until I can upgrade. The skin really looks great!

    Any further questions, feel free to ask here.

  11. iboersma says:

    Hello Paul,

    First, let me thank you very sincerely for providing such a great skin for MediaWiki. I run a currency trading analysis and education site (several of them, actually) and my main reference site uses MediaWiki. I uploaded your 2.0 skin and it looks great except for two (2) things:

    1) In my “Resources” section of the traditional MediaWiki sidebar, I have two custom links that have relatively lengthy labels (“Kumo Trader Forum” and “Boersma & Hunt”). When I applied your 2.0 skin, this caused the resulting tabs to spill over on top of each other. Being a currency trader and NOT an uber-geek, I’m not exactly sure how to rectify this via CSS. Can you help me figure out how to give all tabs more space to display these longer titles?

    2) I have many 800 X 400 currency charts in my MediaWiki site and they seem to be causing the background (white/yellow portion) to spill to the right, beyond the blue header portion. How can I fix this? Basically, I want to expand the overall content and header sections to allow for larger content and still remain centered.

    I would love to upload a screenshot of the issues above, but I don’t see any way to do that here…

    I appreciate your help on this!

    Best,

    Ian Boersma

  12. Paul Gu says:

    Hi Ian,

    You are welcome. Could you send me the link of your screen shots that have issue (you can put screen shots on somewhere that I can reach).

  13. iboersma says:

    Hello Paul,

    I figured out the Tab issue. I was using a new category in the sidebar for my two custom links and when I moved those links up into the default “Navigation” category, they added correctly.

    I’ve included a URL for my site with your skin applied so that you can see what I’m talking about as far as the spillover for the main content section. Here is the URL for a sample page with this issue:

    http://boersmaandhunt.com/ichimoku_wiki/index.php?title=Ichimoku_components

    Note that if you go to my index page http://boersmaandhunt.com/ichimoku_wiki you don’t have this spillover issue as there are no images displayed there. My images are all 800 x 400 (approximately) and trying to reduce them in size is going to create distortion since they are all saved as GIFs. So – I need to figure out how to 1) increase the default display for the header, main content section and footer to accommodate these 800px graphics and 2) center the whole thing so that it is not further to the right-hand side.

    I really appreciate your help. I’m jazzed to use your skin!

    Best,

    Ian

  14. Paul Gu says:

    Hi Ian,

    My skin doesn’t support two column navigation menu, two column menu needs sidebar style.

    I had checked your site, it works great under Internet Explorer 6.0 and Firefox 2, I don’t see anything wrong. What browser and platform are you using?

    If you change the logo, open file “LocalSettings.php”, add or change this $wgLogo to your logo, for example

    $wgLogo = “/wiki/skins/common/images/mylogo.png”;

    If you want to increase height of the header, open file “_ycgu_template.css”, find this:

    #header {
    background: #336699;
    position: relative;
    z-index: 100; /* make logo visible over content*/
    min-height: 120px; /* height of header */
    height: 120px; /* need for IE */
    voice-family: “\”}\””;
    voice-family: inherit;
    margin: 0;
    padding-top: 30px; /* height factor of header */
    } #ignored {}

    Change the height to your desired size.

    if you want center the content, open file open file “_ycgu_template.css”, then add

    #mainContent {
    text-align: center;
    }

    Hopefully those can help you customize.

  15. iboersma says:

    Paul,

    Thanks so much for your help. I took a look at the site using Firefox and it looked fine, like you said. IE 7.0 is the issue, it appears, as all the pages where I have images shove out the middle, content section to the right while the header and footer remain static. Very strange. Well – not much I can probably do about that, so I’ll just live with it.

    Thanks for your tips on centering and increasing header size. I really appreciate it!

    Best,

    Ian

  16. Paul Gu says:

    No problem.

    This issue is mostly like positioning issue in IE, you can try this, open file “_ycgu_template.css”, then add this tag:

    img {
    position: relative;
    }

    or you could use wiki templates for your your images, and try add “position: relative;” inside your template.

    Paul

  17. Ian Boersma says:

    Paul,

    Me again. One more tweaking question. I have a graphic logo that is wider than the 190px for your default logo. It’s probably somewhere around 400px wide. How do I go about allowing for this wider graphich logo to show correctly? I changed the 190px in the ycgu_template.css #p-logo section, but that doesn’t seem to have made any difference…

    Thanks in advance!

    – Ian

  18. Ian Boersma says:

    Hey Paul,

    I’m still rubbing two sticks together as far as trying to get the larger logo I mentioned in my previous post (400px wide) to work. Any suggestions? The default logo looks like it only has 190px of width to work with.

    Thanks,

    Ian

  19. chardinet says:

    Hi Paul,

    I have tried to install your skin to the 1.8.2 version of MediaWiki. I just want to know if my path was right. I just copied the 3 files from your installer folder and drag it to the skin folder of my installed wiki. I also remove the underscore in the file name but also it doesn’t work..did i miss something?

    tnx in advance

  20. Paul Gu says:

    I think you did the path right. If you want to remove the underscore in file name, you need to change related code as well, I don’t recommend you to do that unless you know CSS and php programming.

  21. Ian Boersma says:

    Paul,

    Any chance you can shed some light on the graphic logo issue I posted my previous two questions on? Sorry, but a web developer I am not…

    Thanks,

    Ian Boersma

  22. Paul Gu says:

    Hi Boersma,

    Open file _ycgu_main.css, and change the number in tags: #p-logo and #header.

  23. Gil says:

    Hi Paul, 你好吗?(your seat covers suggest you read Chinese :-) )

    I haven’t really tried the 3.x skin (yet) but I guess this comment applies to it too :

    The ‘Go to” and “Search” buttons being “text images”, they don’t fit too well in a multilingual environment (one of my wikis is in english, french [I’m a froggy] and [a little of] chinese).

    I had to make a small change from an
    – input type=’image’ src=” etc.to an
    – input type=”submit” name=”go” etc.

    It’s no big deal but you may want to consider it for people who just download skins and know little of HTML and PHP. The “title” would be better localized too if you stick to “input type=’image'”.

    BTW, only your skin (the mediawiki one, I mean :-) ) is on my server so I guess that tells how much I like it.

  24. Paul Gu says:

    Hi Gil,

    Thanks for great comment, I will apply it into my next release :D.

  25. I found your skin today and applied it to my website. I like it a lot. I wonder what the easiest method is for me to add a text title at the very top in the empty space? I’ll probably work on it tonight.