HI I’m new to Buddy Press and WordPress in particular if you guys don’t mind check out this link http://www.animeexplosion.helihost.org is there a way to change the menu buttons example Home, Activity, Members to a color to match the banner? If so how what line of code should I be looking for to change? Also is there a way to change the alignment of those buttons?

[@beckb Participant 14 years, 4 months ago]

I can’t pull up your site at all, or I’d give it a go. Shouldn’t be a hard fix.

[@aekevin Participant 14 years, 4 months ago]

I made a mistake sorry URL is http://www.animeexplosion.heliohost.org didn’t park my domain yet, damn typo.

[@sitehelp Participant 14 years, 4 months ago]

Its controlled by NAV element.

Just had a quick look in default.css

div.item-list-tabs {
clear: left;
overflow: hidden;
margin: 25px -19px 20px -19px;
background: #eaeaea;
}
div.item-list-tabs ul li a {
text-decoration: none;
}

div.item-list-tabs ul {
width: 100%;
}
div.item-list-tabs ul li {
float: left;
margin: 5px 0 0 5px;
}
div.item-list-tabs#subnav ul li {
margin-top: 0;
}

div.item-list-tabs ul li:first-child {
margin-left: 20px;
}

div.item-list-tabs ul li.last {
float: right;
margin: 7px 20px 0 0;
}
div.item-list-tabs#subnav ul li.last {
margin-top: 4px;
}

div.item-list-tabs ul li.last select {
max-width: 175px;
}

div.item-list-tabs ul li a,
div.item-list-tabs ul li span {
display: block;
padding: 5px 10px;
text-decoration: none;
}
div.item-list-tabs ul li span {
color: #aaa;
}

div.item-list-tabs ul li a span {
display: inline;
padding: 0;
color: inherit;
}

div.item-list-tabs ul li.selected a,
div.item-list-tabs ul li.current a {
background-color: #fff;
color: #555;
font-weight: bold;
-moz-border-radius-topleft: 3px;
-webkit-border-top-left-radius: 3px;
-moz-border-radius-topright: 3px;
-webkit-border-top-right-radius: 3px;
}
ul li.loading a {
background-image: url( ../images/ajax-loader.gif );
background-position: 92% 50%;
background-repeat: no-repeat;
padding-right: 30px !important;
}
div#item-nav ul li.loading a {
background-position: 88% 50%;
}

div.item-list-tabs#object-nav {
margin-top: 0;
}

div.item-list-tabs#subnav {
background: #fff;
margin: -15px -19px 15px -19px;
border-bottom: 1px solid #eaeaea;
min-height: 35px;
overflow: hidden;
}

div.item-list-tabs ul li.feed a {
background: url( ../images/rss.png ) center left no-repeat;
padding-left: 20px;
}

Change the #colours to suit.

I think that is correct. Apologies if not

[@aekevin Participant 14 years, 4 months ago]

Can you give me a bit more precise location for the file that I’m editing I’m assuming it’s in the buddypress theme itself under default.css?

[@beckb Participant 14 years, 4 months ago]

Actually, I believe this is the more relevant code:
ul#nav {
margin: 0;
padding: 0;
position: absolute;
right: 15px;
list-style: none;
bottom: 0;
max-width: 65%;
}
ul#nav li {
float: left;
margin: 0 5px 0 0;
}
ul#nav li a {
display: block;
color: #fff;
text-decoration: none;
padding: 5px 15px;
background: url( ../images/60pc_black.png );
-moz-border-radius-topleft: 3px;
-webkit-border-top-left-radius: 3px;
-moz-border-radius-topright: 3px;
-webkit-border-top-right-radius: 3px;
}
ul#nav li.selected a, ul#nav li.current_page_item a {
background: #f5f5f5;
color: #555;
}
ul#nav a:focus { outline: none; }

Are you just using the default theme?
If you’re going to mod very much at all, you should technically create a child theme and work from there, although it’s easy enough to save your CSS as you go.
(Hey, smart forum members, is there already a skeleton theme somewhere? I could probably post one, if not.)

Anyway, assuming you’re working from the default theme, find the folder “bp-default” in the “bp-themes” folder in the buddypress plugin folder. Then open style.css and, working from the above, after the existing lines in the style.css file, add only the parts that pertain to color (e.g., ul#nav li:hover > a{background-color:#330033; color:#9900FF;}
). That way, as long as you remember to backup this file regularly, you’ll know exactly what you’ve modified from the original.

If you want a menu with dropdowns, we’ll need to add some other code. Can pretty easily modify it to use WP3’s new custom menus. You can also remove (some or all of) the buddypress bits from that top menu if you want less clutter.

[@beckb Participant 14 years, 4 months ago]

To be a bit clearer, here’s the info from the style.css file on making a child theme:
Instead, please read this codex page on how to build a BuddyPress child theme:

https://codex.buddypress.org/how-to-guides/building-a-buddypress-child-theme/

And if you decide not to make a child theme, make sure you put any modified styling info after these lines:

/***
* The default theme styles.
*/
@import url( _inc/css/default.css );

/***
* The admin bar default styles
*/
@import url( _inc/css/adminbar.css );

[@aekevin Participant 14 years, 4 months ago]

I’m using the default buddy press Widget theme, what I I would like to do is pretty much change the color to match the banner but if possible remove the menu tabs from the banner area altogether to be placed somewhere more convenient so that it’s not distracting or as you said cluttered. Whichever one works better. I’m more familiar with other Open Source CMS so it rather challenging coming from a different system and modding this one.