color coded tabs in menu

If you don’t find a theme that is specifically set up in that way, it would be fairly easy to do with any WordPress theme that supports the custom menus feature that was added in WordPress 3.0

Custom menus let you add custom classes to menu items. I’d add a class of “green” to each menu choice you want displayed with a green background, etc.

Then it requires one or two lines of CSS added to the site’s stylesheet for each color, so the browser displays those tabs with that color.

Someone on this forum would help you set the CSS for your tabs once you’ve added the custom classes to each menu item. (Adding the classes is done on the Menu screen in the dashboard area)

Many thanks for the speedy response stvwlf.

I understand completely what you’re saying – tis just a case of me being able to put it all into practice so that it works!

When I look at the Menu screen (where I already have a custom menu built), I can’t see where I would add a class?

Sorry for the inane question!

jeni

Hi

You can’t see it because its hidden by default. Click Screen Options in the upper right corner of the Menu page, check Classes, and the Classes field will miraculously appear on your menu items. Then you can add the classes for colors and take it from there.

Also what you should do is get the color codes for the shades of the colors you want, so if you post on the forum to get help with the css, you can say you want the green to be #42973e for example. That makes it easy for the person who is helping you.

You can either find a website with color charts or use a color picker tool to point at colors you like on the web to find their color code. There is a free Firefox addon called Colorzilla you can install that does exactly that.

I am laughing hysterically at my inability to locate the ‘bleedin obvious’ ! Yes, the classes option has now appeared.

I will get to experimenting. I usually use Adobe Kuler but will have a look at Colorzilla as I haven’t used it before.

Again, my thanks for your clear and precise assistance

jeni

Hi

I don’t find where the classes are hidden bleeding obvious at all. The first time I became aware they existed (from an article on the web) it took me half an hour to locate them. And I really needed what they allow.

If you have another tool to find color codes its perfectly fine to use it. Many people who ask questions here wouldn’t know what a color code is so I try not to assume anything about someone’s level of understanding. Most people have Firefox so I suggest a Firefox addon since it is free and easily installed. I actually use a different tool myself.

and you are welcome, thank you
Steve