Change Comment box Font color

This can be added to a custom style sheet via a custom CSS plugin or Jetpack’s custom css module:

#respond #commentform textarea {
    color: #000;
}

You’ll need to check what it affects and doesn’t and then it can be refined if necessary.

Bill:

Thank you! That is exactly what I was looking for. The text in the blog comment box is now black. Unfortunately, it did not carry over to the bbPress post/comment box. Any idea what the code would be for that?

Thanks,

David

Sorry, but it seems I have to be logged in to your forums (assuming that’s the section you’re referring to) in order to see a comment box.

You can try using your browser’s developer tools to identify the classes applied to the comment form element and create a new rule for ‘color’ as I did above. Some browsers will have a right-click contextual menu shortcut for inspecting an element. Let me know if you have trouble.

Bill:

That is the section I am referring to. I have temporarily removed the registration restriction to give you an opportunity to look at this further.

I tried using the browser tools earlier but I’m afraid I don’t know enough to know what I am actually looking for and then what css to create to fix it.

So, I would appreciate your additional assistance with this.

I am brand new to WordPress and while I have learned a lot in a short period of time, it seems like for every new thing I learn I discover two more that I need to learn.

Thanks again for your help.

Regards,

David

Not to worry. CSS can get complicated fairly quickly when you have WP plus your theme plus plugins all adding up.

OK, try adding something like:

#bbpress-forums input.text,
#bbpress-forums textarea {
    color: #000;
}

Bill:

Yes, that seems to have do exactly what I was looking for. Thank you so much.

Can you point me to what you looked for in the browser inspector to figure this out. I looked for the code but got completely lost.

Thanks again for your help.

Regards,

David

Now that you’ve closed it up again, I can only tell you generally what I did. I’m using Firefox and the Firebug plugin (but the built-in dev tools are pretty similar).

I went to the forums page and put some text in a couple form text fields to watch for results as I made changes. With the dev tool html panel open, I used the element selection tool and clicked one of those fields (and maybe backed out into its containing parent elements) until I found which one was controlling the text color. I felt we needed to include not just the comment field but the others as well, for readability. Try changing the color attribute in the css panel on the right, and there you go.

In fact, if you want more inclusion as well for your original (first) fix above, try changing it to this:

#respond #commentform textarea,
#respond #commentform .text {
    color: #000 !important;
}

Sorry, I opened it up again for you.

I do use Firefox. Do you suggest I add the Firebug plug-in? Does that make things a bit easier?

I like Firebug mainly because I’m used to it, I think. It’s very good and worth installing just to try it out. Try both it and the built-in tools and see what you think.

I just noticed, we need to adjust one more time the above to:

#bbpress-forums input.text,
#bbpress-forums textarea,
#bbpress-forums input[type="text"] {
    color: #000 !important;
}

to get everything in agreement. I hope that gets you there.

Bill:

I will check it out.

Thanks for all of your help. I really appreciate it.

If you are done, I will mark this issue as resolved and lock down the Forums again.

Regards,

David

Bill:

I’m wondering if I can impose upon you with help on another problem. I’ve already posted this earlier today but no one has responded yet.

On the Forums page, towards the bottom is a default box that says:

“Oh Bother! No topics were found here.”

It appears because it is an index page of topics and forums so there won’t ever be topics there. There is also a box underneath that box that says:

CREATE NEW TOPIC IN”APPLE TECH TALK FORUM”

I installed Firebug and located the code for both (they are very near each other) and this is what I came up with.

<div class=”bbp-template-notice”>
<p>Oh bother! No topics were found here!</p>
</div>

<legend> Create New Topic in “Apple Tech Talk Forums” </legend>

The second entry is part of a bigger div statement that defines the larger text box.

From the little I have learned I think these are HTML statements and not CSS statements so putting them in Custom CSS won’t help me.

Is there an easy way to get rid of both of these lines?

I have left the forums unlocked in case you need to get into them.

Thanks,

David

David, go ahead and mark this as resolved since the original question has been taken care of.

The last one you tacked on here seems to resolve with the following:

.postid-100 #bbpress-forums > div:nth-child(7),
.postid-100 #no-topic-0 {
????display: none;
}

I can’t make any guaranties on this one because these forum pages are very dynamic and constantly update, and one of the elements in question has no unique identifier that I can use. If (7) changes for some reason, it will have to be adjusted. There may be other (better) ways to go about this (as is common with css), but this is my shot for now. You might want to ask in the forum for bbpress.

Bill:

This code didn’t seem to work but I appreciate you trying.

I have certainly taken enough of your time. Thanks for all of your help on these issues.

Best regards,

David

Bill:

By the way, I did post this on the bbPress forum but no one has come up with an answer or even a suggestion at this point.

Regards,

David

Sorry about that. It worked for me in Firefox, but as I said, there aren’t really any good unique identifiers for the first of those two elements (at least nothing obvious to me). Hopefully you’ll get some feedback from the bbpress folks.

You’re welcome, and good luck!