Changing the Color to "Leave a Reply"

Home Forums Automattic On a Whim Changing the Color to "Leave a Reply"

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #110727 Resolve

    Lori

    One more question: I want to change the color on my “Leave a Reply” and the part where it says “16 thoughts on so & so post.” I have tried to figure out where the color is coming from for this, but I can’t. I am not liking the color and want to change it, but can’t figure out how. Is there a CSS code I can use to do this?

    The blog I need help with is creatingbeautyinthekitchen.wordpress.com
    #148812

    Kathryn P.
    Happiness Engineer

    Looking at the source code with Firebug or in the browser source, you can see this:

    <span class="comments-link">
    <a title="Comment on Creamy Caper & Sun Dried Tomato Chicken" href="http://creatingbeautyinthekitchen.wordpress.com/2014/03/25/creamy-caper-sun-dried-tomato-chicken/#respond">Leave a comment</a>
    </span>

    That means the the comment reply text is in a link (a tag) within the comments-link span class, so this should do the trick:

    .comments-link a {
    color: #xxxxxx;
    }

    The recipes on your site look delicious! I did want to let you know that I find your centered text in every post a bit hard to read. Centered text is really meant for very small pieces of text. Large blocks of centered text make are known to make reading more difficult. You might want to consider leaving the text left aligned for that reason.

    Bon appetit!

    #148817

    Lori

    Hi Kathryn! Thanks again so much for your help! I really appreciate your feedback on the centering…I had no idea that was hard to read, so I am so glad you told me! I have changed that on my last couple posts and will keep it left aligned in the future.

    The CSS code you gave me changed the part that says, “1 comment”…the part at the end of a post that tells you how many comments you have. I don’t mind the color there, I was hoping to change the color on the text that actually says, “Leave a Reply.” In this case, I have changed it to “Say Something.”

    #148819

    Kathryn P.
    Happiness Engineer

    Ah, you mean the text on the single post view, like this?

    http://creatingbeautyinthekitchen.wordpress.com/2014/03/25/creamy-caper-sun-dried-tomato-chicken/

    If you use Firebug or another browser inspector you can see that this bit of text has the class comments-title, which means you can target it like this:

    .comments-title {
    color: #xxxxxx;
    }

    p.s. the left-aligned text looks much better and is much more readable!

    #148820

    Lori

    Thanks for your continued help Kathryn! Okay, so that changed the part on the single post that says, “2 thoughts on Creamy Caper & Sun Dried Tomato Chicken” but not on the “Say Something” part that is at the very bottom. Does that make sense?

    #148824

    Kathryn P.
    Happiness Engineer

    Sure, have you tried to use a browser inspector on that element yet? I’m encouraging you to do this so you’ll be able to make other changes more easily on your own in the future. :-)

    If you use a browser inspector to select the words “Say something”, you’ll see this in the code:

    <h3 id="reply-title" class="comment-reply-title">Say Something...

    That means you can target either the ID or the class to modify it. To get specific enough with the targetted CSS, you’ll need to also include the #respond ID in which it’s contained:

    Try this, for example:

    #respond #reply-title {
    color: #xxxxxx;
    }

    #148825

    Lori

    It worked perfectly! Thank you so much Kathryn! I tried to use a browser inspector at first and it was a bit confusing. I have worked with css a lot on forums and made my own themes there, so hopefully I will be able to get a grasp on this as well. I probably just need to take some more time to look at it and process it. I so appreciate your help!!

    #148829

    Kathryn P.
    Happiness Engineer

    Glad that did the trick.

    I’m sure that working on your ability to find the right CSS selectors will be time well spent if you plan to make more tweaks in the future. It can be a bit tricky at first but the more you do it the more you’ll get the hang of it – good luck!

    I’ll mark this thread as resolved and close it, but feel free to start a new one if you need help with anything else.

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

The topic ‘Changing the Color to "Leave a Reply"’ is closed to new replies.