WordPress.org

Support

Support » Themes and Templates » changing header font colour, type and size in child theme

changing header font colour, type and size in child theme

  • sharonmsmyth
    Member

    @sharonmsmyth

    Earlier someone helped to solve my problem about getting my child theme for twentytwelve theme to work – it now does.
    I’ve changed the font type but can’t work out how to change the headers throughout to a new colour and size.

    I’ve tried adding the following to my child theme css file:

    h1, h2, h3 [
    font-style: Trebuchet MS
    color: #b6e4b7
    ]

    This doesn’t work – any advice please?

Viewing 10 replies - 1 through 10 (of 10 total)
  • esmi
    Forum Moderator

    @esmi

    Try:

    h1, h2, h3 {
    font-family: "Trebuchet MS", sans-serif;
    color: #b6e4b7;
    }

    sharonmsmyth
    Member

    @sharonmsmyth

    Given that a try but that hasn’t worked either.
    I’m working in the style.css file – that is the right place for the header style too isn’t it?

    esmi
    Forum Moderator

    @esmi

    Site url? And which style.css file do you mean?

    sharonmsmyth
    Member

    @sharonmsmyth

    It’s http://www.honestyandhumour.com and it’s a style.css file which i’ve created in my new child theme from twentytwelve.

    I want to change all the titles – the page header title and the blue ones.

    esmi
    Forum Moderator

    @esmi

    The font change is working but you need to be aware that it will only work if the person viewing the site already has the Trebuchet MS font installed on their computer. With regard to the text colour, you need to style the a tag, so try:

    h1 a, h2 a, h3 a {
    color: #b6e4b7;
    }

    sharonmsmyth
    Member

    @sharonmsmyth

    What do you mean if they have it installed on their computer? Isn’t it a standard font?
    I’ll try that code now.

    sharonmsmyth
    Member

    @sharonmsmyth

    That’s changed the title in the page – thank you. It hasn’t changed the title at the top of the page?

    WPyogi
    Forum Moderator

    @wpyogi

    You’re missing a semi-colon here:

    body {
    font-size: 14px;
    font-family: Trebuchet MS
    }

    After “MS”

    Some of your CSS is being overridden by this one:

    .site-header h1 a, .site-header h2 a {
        color: #515151;
    }

    So try adding that to your child theme CSS and changing the color and font there.

    esmi
    Forum Moderator

    @esmi

    Isn’t it a standard font?

    Nope. For a start, not everyone is using MS products. 🙂

    sharonmsmyth
    Member

    @sharonmsmyth

    Yay – that fixed it! thank you.

    Are there some fonts that are better to use then? Ones which won’t pose a problem to anyone?

    thank you for your help

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘changing header font colour, type and size in child theme’ is closed to new replies.