WordPress.org

Ready to get started?Download WordPress

Forums

Origin
Changing Blog Post Titles' Color (4 posts)

  1. alexjonesbooks
    Member
    Posted 9 months ago #

    Hello... I'm building a website and I love the Origin theme, I just can't figure out how to change the color of the blog post titles. I have a dark background, and the dark color of the text makes it very difficult to read...

    The website is: alexjonesbooks.com

    The current custom CSS is:

    .find-box-search,.find-box-buttons {
    background-color: #f7f7f7;
    color: #e6e6e6;
    border-top: 1px solid #ddd;
    }

    .find-box-head {
    color: #e6e6e6;
    }

    .page-numbers:hover {
    border-color: #e6e6e6;
    }

    #header .description {
    text-decoration: none;
    color: #e6e6e6;
    }

    I've worked with CSS years ago, but I don't remember a lot of finer-tune stuff... I'm pretty much shooting in the dark! Thanks in advance for any tips, tricks or fixes.

  2. paulwpxp
    Font hero
    Posted 9 months ago #

    This should make it more readable with dark background.

    body { color: #ddd; }
    h1, h2, h3, h4, h5, h6 { color: #99ccff; }
    #site-description { color: #99ccff; }
    .hentry .entry-title, .singular .entry-title { color: #fff; }
    .entry-title a:hover { color: #ccc; }
    .sidebar .widget ul li a { color: #ddd; }

    Change color code as needed. Please make sure all the modification in CSS is in Custom CSS option. Keep the main theme stylesheet untouched as new, so there won't be any problem when theme updates.

  3. alexjonesbooks
    Member
    Posted 9 months ago #

    Thank you so much! That is fantastic! I've added that to custom CSS section... Everything looks perfect, except for the title links on the blog (still showing up as dark grey). The blog is alexjonesbooks.com/blog.

    I've tried to figure out what the tag is for that particular element... Neither a header tag (h1, h2, etc) or the .entry-title tag seem to work. Would there be something in the original CSS that is messing with the new modifiers?

    Thank you again for the CSS! That's exactly what I was looking for :)

  4. paulwpxp
    Font hero
    Posted 9 months ago #

    I missed this one

    .entry-title a, .entry-title a:visited { color: #ddd; }

    So, all together

    body { color: #ddd; }
    h1, h2, h3, h4, h5, h6 { color: #99ccff; }
    #site-description { color: #99ccff; }
    .hentry .entry-title, .singular .entry-title { color: #fff; }
    .entry-title a, .entry-title a:visited { color: #ddd; }
    .entry-title a:hover { color: #ccc; }
    .sidebar .widget ul li a { color: #ddd; }

Reply

You must log in to post.

About this Theme

About this Topic