I am unable to change the header text color

  • Unknown's avatar
    cmg348 · Member ·

    Greetings,

    According to the WordPress support page, “you may change [the header text color] from the Customizer in the Site Title panel.”

    However, when I open the Site Title panel, no option to adjust the color of the header text appears.

    Ideally, I would like to be able to change the color of the text in the main header, as well as page titles and the main navigation menu.

    I am using the “Hemingway Rewritten” theme.

    Thanks for your help,

    Charles

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

  • Unknown's avatar
    cmg348 · Member ·

    EDIT: The blog I need help with is: remediatingthearchive.wordpress.com

  • Unknown's avatar
    lizthefair · Member ·

    If you’d like to change just the header text color, you can do that from the WP admin view of your header options.

    https://remediatingthearchive.wordpress.com/wp-admin/themes.php?page=custom-header

    Ideally, I would like to be able to change the color of the text in the main header, as well as page titles and the main navigation menu.

    This is possible as well, we’d just need to use CSS to go it. I’m happy to help you with the code. What color did you have in mind?

  • Unknown's avatar
    cmg348 · Member ·

    Thanks so much for your help!

    I did as you said, and it worked, but only for the tagline, not for the title – I assume because the latter is also a link, so something would have to be overridden in the CSS…

    I’d be very grateful for your help with the CSS, as I’m quite inexperienced with it. The color that I’d like to use is #f5efd5.

    If it’s possible, I would also like to be able to have the page titles centered rather than left-aligned.

    Are these things that I can do just by using the CSS customizer, or would I have to download the style sheet, etc.?

    Thanks again for your help! I really appreciate it.

    CG

  • Unknown's avatar
    lizthefair · Member ·

    I did as you said, and it worked, but only for the tagline, not for the title

    I do see the color change in the title as well, but only when you hover. That’s because the color palate chosen in the customizer is trumping the colors chosen on the header page of WP admin. We can trump those colors with CSS.

    Are these things that I can do just by using the CSS customizer, or would I have to download the style sheet, etc.?

    All the code I give you, and any code you add yourself, is added to the CSS box in the customizer. It’s last place your site looks for CSS info (unless you add CSS directly to a post) so that helps it take precedence over exiting CSS code. It also makes it easy to experiment. You can add code to this box and if you don’t like the results, just delete it and the site will go back to how it was before.

    I’d be very grateful for your help with the CSS, as I’m quite inexperienced with it. The color that I’d like to use is #f5efd5.

    Here’s the code you need to change the site title, menu items, and page titles to your color.

    .site-title a:visited, .site-title a,.wf-active .main-navigation a, .entry-title {
	color:#f5efd5;
}

    “.site-title a:visited, .site-title a” target your site title when it’s a link that has been visited and one that hasn’t. The link color when you hover over the link already worked correctly so I didn’t add any code for that.

    “.wf-active .main-navigation a” targets your menu and ” .entry-title” targets your page titles. The page titles aren’t links, so we don’t need the “a”

    the second part of the expression,
    { color:#f5efd5;}
    is the part that actually changes the color.

    Notice that there are commas between the selectors. That’s because we wanted to do the same thing (change text color) to several items.

    You also asked to center some text. Since we aren’t doing that to all the same page elements we need a separate piece of code.

    If it’s possible, I would also like to be able to have the page titles centered rather than left-aligned.

    We already know the selector for page titles is .entry-title so that part is done. The property that controls text alignment it “text-align” so the code you need looks like this.

    .entry-title{
	text-align: center;
}

    If you’d like to start learning how to write your own CSS, this site shows you the syntax of CSS, includes tips on how to find selectors and how properties work.

    https://cssworkshop.wordpress.com/

    Good Luck! Let me know if you need anything else.

  • Unknown's avatar
    cmg348 · Member ·

    Thank you so much! This worked perfectly! And from here, I think, I can start learning CSS myself – I just needed a little push…

    Thanks again,

    CG

  • Unknown's avatar
    lizthefair · Member ·

    Wonderful. Learning CSS is fun and (for me at least) makes you feel like a web magician. Have fun with it!

  • The topic ‘I am unable to change the header text color’ is closed to new replies.