Making changes to the Comments sections

  • Unknown's avatar
    cfournier224 · Member ·

    Hello!

    I’ve managed to make a lot of changes to my blog myself, but here are a few things that I just can’t seem to get:( I would really appreciate guidance with CSS code for:
    – Comment authors tex: Change colour
    – Comments and replies text: Change colour
    – Comment number box (first one only, with value for total number of comments): Change background colour (not colour of number value)
    – “Leave a Reply” box (has a “+” in it): Change background colour
    – “Older posts” box (at bottom of pages): Change background colour and font
    – Black contour of overall site: Change colour

    Merci:)
    C.

    The blog I need help with is: (visible only to logged in users)

  • staff-jeanpierreac · Staff ·

    Hi!
    Let’s try.

    – Comment authors tex: Change color

    You can use “.comment__author-name a” selector for that. So if you would like a pink color, this could be the css statement. (Try with some other red-green-blue combinations to find your fit)

    .comment__author-name a {
    color: rgb(255,68,169);
}

    – Comments and replies text: Change color

    Selector for this: “.comment__content”, and you need again a color declaration like this: 

    .comment__content {
    color: rgb(255,68,169);
}

    – Comment number box (first one only, with value for total number of comments): Change background colour (not colour of number value)

    Try this piece of code, unchanged if you want red or adapt the rgb parameter.

    .comment-number--dark {
    background-color: rgb(255,0,0);
}

    – “Leave a Reply” box (has a “+” in it): Change background color

    Try this.

    #respond .comment-reply-title:before {
    background-color: green;
}

    – “Older posts” box (at bottom of pages): Change background colour and Font

    To change background color, you need a similar rule, but with this selector: “#infinite-handle span”. So this could works:

    #infinite-handle span{
    background-color: aquamarine;
}

    To change color and font: 

    #infinite-handle span button, #infinite-handle span button:hover, #infinite-handle span button:focus {
    font-family: Arial;
    color: red;
}

    Merci:)

    Je t’en prie :)

    I hope this helps you!

  • staff-jeanpierreac · Staff ·

    By the way, you could maybe like this page:
    http://www.rapidtables.com/web/color/RGB_Color.htm
    to find your wanted rgb values. :)

  • Unknown's avatar
    cfournier224 · Member ·

    HI!

    It all worked brilliantly! I’m just left with the black contour of the overall template / site (not sure what to call it!). Any suggestions for that?

    I’ve also been using this site for to find the right colours – it’s pretty helpful in converting from one scheme to another and I’ve been coding in hex:) http://coolors.co

    C.

  • staff-jeanpierreac · Staff ·

    Thanks!

    Have you tried for that black contour:

    body:before, body:after {
  background: white;
}

    I hope this helps.

  • Unknown's avatar
    cfournier224 · Member ·

    Love it, thanks!
    C.

  • staff-jeanpierreac · Staff ·

    Glad to read that! :)

  • The topic ‘Making changes to the Comments sections’ is closed to new replies.