Topic: How to change the “Members” color in members page

How to change the “Members” color in members page

CreationP
Participant

@creationp

9 years, 2 months ago

I’m messing with CSS and searching for hours on how to change the “Members” title on my website. Nothing seems to work.

I am trying to recolor some elements and I just cannot change anything. I changed the page from BP page to WP/theme page and still nothing works.

I changed the h1 color from css, nothing. h2, nothing. bp-page, nothing. I’m not a css expert and can only do minor edits but I think I reached my knowledge limit on this.

Can someone please help me on that?

Website members page is: http://www.alt-tab.gr/members

Viewing 8 replies - 1 through 8 (of 8 total)

danbp
Participant

@danbp

9 years, 2 months ago
@creationp,

once you have identified the correct element id or class, you add !important to the new rule you want for it.
In a child-theme style.css preferably, something like:
```
h1.entry-title {
 color: #DDD!important;
}
```
Note that this example will we applied to ALL page title.
CreationP
Participant

@creationp

9 years, 2 months ago

@danbp

Thanks for the fast reply. The problem is I did use the !important tag. I identified the h1.main-title as found throught the firefox inspector and added on the style.css the “color:red !important;” at the end of every other element inside the brackets. I did it on h1, h1.main-title and some other css elements but nothing worked.

If it is not to much trouble could you also have a look at the inspector and check if I identified the correct elements?

I changed to the color of my choise on:

h1.main-title, h1.page-title, h1

Then I tried on some bp-page elements after browsing the style.css of the theme. I also changed the page to wp-page/theme and bp page.

Nothing worked.

If it is not to much trouble could you also have a look at the inspector and check if I identified the correct elements?

danbp
Participant

@danbp

9 years, 2 months ago

h1.main-title, h1.page-title doesn’t exist. Why don’t you try the example at first ?

Also, don’t apply template models to BP pages. These are only placeholders used internally, not ordinary WP pages.

Follow some guidelines on Codex before getting in more trouble.

CreationP
Participant

@creationp

9 years, 2 months ago

I’m trying and trying and can’t find any lead on that.

The codex is complex and I cannot understand the child theme concept. Is it a child theme of the bp or a child theme of the theme I use (explicit)? If it is of the theme I use how can i make it to incorporate buddypress?

To add to the problems, alt-tab is a website that receives 1000+ visits/day and I cannot put it in maintenance mode in order to work on my leisure.

I hate to ask you that, and I know you have better things to do rather than answering questions, but can you please take me by the hand and lead me to solving this problem as I am unable to solve it on my own. Especially in a live environment.

When I firebug the “Members” title in the alt-tab.gr/members page I get the following:

I am at a loss here…

Henry Wright
Moderator

@henrywright

9 years, 2 months ago

How are you linking your style sheet? Make sure you’re using wp_enqueue_style().

Ref: https://codex.wordpress.org/Function_Reference/wp_enqueue_style

danbp
Participant

@danbp

9 years, 2 months ago

Which theme do you use ? Seems you renamed yours to Test, and i was unable to find it somewhere.
Also, do you use a cache plugin ? If it’s the case, disable it or clear it while testing CSS.

I cannot put it in maintenance mode

This is not necessary if you had a local copy. I strongly recommend you do that if you want to manage correctly a high traffic site.

You can use a child-theme for your theme, not for BP which has no theme since 1.9. The one called bp-default is no more maintained and is only in for temporary backward compatibility for (very) old BP site.

BP use templates, which are stored in bp-templates/bp-legacy/buddypress/. Those templates are tailored to fit with almost any recent (and decently coded) themes.

Creating a child theme is explained on hundreds of sites and on WP’s codex. Additionnal infos for BP are given here.

CreationP
Participant

@creationp

9 years, 2 months ago

@danbp

I am using xplicit for a theme. I also use a cache plugin that is not caching for logged in users.

I am taking local backups and restoring if something does not feel good. Through all my testing and experimentation with buddypress nothing have been changed as I revert all changes that do not work.

Now that you mentioned templates, is it possible to find somewhere already created templates with different color profiles and change them from there?

I found yesterday the buddypress.css maybe the answer lies there? I don’t mind redoing all the work every update as I only need to change 2 titles. Everything else fits to us.

danbp
Participant

@danbp

9 years, 2 months ago

buddypress.css contains all styles used by BP.

I also use a cache plugin that is not caching for logged in users.

If i understand this correctly, it means that if i visit your site without being logged in, i get a page from the cache, right ? This means logically that you have to be logged in while testing your change. And finally, it could be possible that non logged users see (it’s an example) a black title (cached) and logged-in user see a red title (the most recent, not cached, version of the new style applied to that page). Hum…

When you use a child-theme, and his mandatory style.css, the child has priority over the parent theme, and buddypress.css.

Child theme is the only safe strategy to get your customization without loosing your work at each update. You add to it only what you want to modify. Even if you need to change only 2 title styles.
In your case, you need only a style.css with a rule or two for your titles. You don’t have to add template files.

is it possible to find somewhere already created templates with different color profiles

A template is a structure of different HTML tags and some php code for dynamic content.
A theme is a design applied to this armature.
A content is what is showed inside the structure.
HTML is used to build the structure
CSS is used to build the layout/design
Content is text, images, videos, etc
PHP is a coding language to build dynamic pages between a database and a server.

BuddyPress template files are stored in wp-content/plugins/buddypress/bp-templates/bp-legacy/buddypress

Unfortunatly for you, the theme is a premium one for which we can’t provide support, as we have no access to his code and can’t install it to test without using a licence.

See theme doc for information about child theming it and other advice for adding custom CSS.