Need help? Check out our Support site, then


WordPress.com Forums » CSS Customization

selectors

  1. olalaboutique
    Member

    Hi, My blog is olalaboutique.com, and I´m using Coraline theme.

    I need to know three selectors: the two below the post title: date and "Leave a comment", and also, when you select certain post, it appears in top of its title the last post name. That one too.

    Can you help with that?

    Thanks.

    The blog I need help with is olalaboutique.com.

  2. thesacredpath
    Member

    Date: .entry-date a

    Leave a comment: .comments-link a

    Previous post link: .nav-previous a

    Next post link: .nav-next a

  3. olalaboutique
    Member

    Thanks. I want all four to be gray, and their hover version to be #ff3333

    So far I´ve made some of them work, but I´m having problem with the .entry-date a:hover, and with the previous and next post link, both in normal and hover.

    I used this code, I will appreciate some help:

    .entry-date a {
    color:grey;
    }

    .comments-link a {
    color:grey;
    }

    .entry-date a:hover {
    color:#ff3333;
    }

    .comments-link a:hover {
    color:#ff3333;
    }

    .nav-previous a {
    color:grey;
    }

    .nav-next a {
    color:grey;
    }

    .nav-previous a:hover {
    color:#ff3333;
    }

    .nav-next a:hover {
    color:#ff3333;
    }

  4. thesacredpath
    Member

    I should have dug deeper into this before replying above. This handles all the hover states for the previous and next links at the top of the single-post pages and catches the date and a few more instances where the colors were still showing up as original.

    .navigation a:visited:hover, .navigation a:active, .navigation a:hover {
color: #ff3333;
}

.navigation a:visited {
color: grey;
}

.entry-meta a:hover, .entry-info a:hover, #colophon a:hover {
color: #ff3333;
}

  5. olalaboutique
    Member

    Thanks, it all worked out, except for the previous and next posts.

    I added this and it seems to be ok, what do you think?

    .nav-previous a {
    color:grey;
    }

    .nav-next a {
    color:grey;
    }

    By the way, what is the grey that appears originally in the "Posted on" text below the title post? I think is slightly different from just grey.

  6. thesacredpath
    Member

    Ah, I should have caught those. I actually think I did when I was doing it but forgot to include them. Doing too many things at once perhaps.

    The grey in the "posted on" is a hex color: #888888 .

  7. olalaboutique
    Member

    Thanks.

  8. thesacredpath
    Member

    You are welcome.

  9. olalaboutique
    Member

    I just realized there are some text with the old typography (body, date, leave a comment, etc) I want all to be century gothic.

    Can you give me a hand with that?

  10. thesacredpath
    Member

    This I think changes everything else, including the credits in the footer.

    .entry-meta, .entry-info p, #colophon {
font-family: "Century Gothic",Helvetica,Arial;
}

  11. olalaboutique
    Member

    Thanks, sacred path. I believe we are only missing the body text, as in "Pasarela Sport City" post its shown.

    Oh, and another thing: can you give me the selectors to change the "Leave a comment" text and its hover?

    Thanks again.

  12. thesacredpath
    Member

    This will get the fonts in the content.

    .entry-content, .entry-summary {
font-family: "Century Gothic",Helvetica,Arial;
}

    Not knowing exactly what you want to change on the leave a comment and its hover, I've only included the text color and the bold declarations. and the hover text color. If you want to change something else about it, let me know. I'm heading down shortly to listen to have dinner and listen to one of my favorite bands and will probably not be back to this thread for several hours.

    .entry-info .comments-link a {
color: #333333;
font-weight: bold;
}

.entry-info .comments-link a:hover {
color: #FFFFFF;
}

  13. olalaboutique
    Member

    Ok, thank you very much. I hope you enjoyed that.

    I´m only missing the selector to change the color of the black button that appears in the hover of "Leave a comment".

  14. thesacredpath
    Member

    Add a background declaration to the second bit.

    .entry-info .comments-link a:hover {
background: #222222;
color: #FFFFFF;
}

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags