• Resolved kbyr7

    (@kbyr7)


    Hi,

    I am currently using a child theme (Preus Plus is my parent theme) and I don’t quite understand how to adjust my font color for posts, pages, widgets. I have tried to add css code in my child theme as well as change the parent theme code. Neither seem to make a difference. I’m not sure what I am doing wrong.

    https://www.wholelotofhappiness.com

    The default font color is a light gray and I’d like a darker, more readable gray.

    Thanks for helping!

Viewing 15 replies - 1 through 15 (of 16 total)
  • What CSS code have you tried adding and are you sure you are adding it to the right place? For post/page content, it looks like you need to be targeting

    .entry-content

    as that is where the light grey is set. It looks like your widget font colors are coming from multiple areas. Try using Google Chrome developer tools (F12 while in Chrome) or Firefox’s Firebug to pinpoint the exact classes/id’s you need to target in your stylesheet.

    body main article .entry-content { color: #ff; }

    Add that into your css and tell us what happens.

    @kbyr7, don’t edit the parent theme code. Just add code to the style.css file in your child theme folder. You can use the following code:

    .entry-content{
        color: #595959;
    }

    The issue was discussed that he wasn’t properly targeting the element, correct?

    @websitetroubleshooting, it is not difficult to know where to change the font colors since the OP stated the color needs to be changed for the posts, pages, and widgets. We already targeted the page content.

    Now, for the widgets, you would need to use the following code:

    .widget a {
      color: #595959;
    }
    Thread Starter kbyr7

    (@kbyr7)

    I added both the .entry-content and .widget a codes but I don’t see any changes in my font color. I also added !important; to the end of the codes but it didn’t make a difference.

    Am I putting it the right place?

    Theme Name: Preus-child
    Description: Child Theme of Preus Plus
    Author: Katie
    Template: preus-plus

    (optional values you can add: Theme URI, Author URI, Version)
    */

    @import url(“../preus-plus/style.css”);

    .entry-content{
    color: #595959; !important;
    }

    .widget a {
    color: #595959; !important;
    }

    If you are going to add the !important attribute, make sure there is no semicolon before !important. For example,

    .entry-content{
       color: #595959 !important;
    }

    body main article .entry-content { color: #595959; }

    @websitetroubleshooting, first of all, use code tags and second of all, you don’t need to be that specific. Just .entry-content will do.

    He stated that this does not work, this is for troubleshooting only. I am trying to see if it is an issue with selectors in the DOM.

    @websitetroubleshooting, there are no issues with selectors. Besides, the OP probably is a female so don’t assume the OP is a “he.” Also, the OP has to try the !important attribute.

    @kbyr7, try the code I gave you that correctly uses the !important attribute.

    Wow. Rude.

    @websitetroubleshooting, I am not being rude. I am just pointing out certain things.

    Thread Starter kbyr7

    (@kbyr7)

    Thanks for all your help so far!

    @respectyoda, I took off the semicolon so the code is correct… but no change.

    Looks like we’ll have to target it even more specifically, so try this.

    .entry-content p{
        color: #595959;
    }

    Try this without the !important attribute and report back. ??

    Note: the color change may be hard to detect because you are going from one shade of grey to another shade of grey.

Viewing 15 replies - 1 through 15 (of 16 total)
  • The topic ‘Help Changing Font Color in Preus/ Child Theme’ is closed to new replies.