• Resolved getaheadsolutions

    (@getaheadsolutions)


    I would like to change the font for the site title in the left sidebar – have looked around in the css to find the reference (so I can then add to custom css) and thought it was
    site-title
    however when I use that ref in my custom css it doesn’t make any change to the font.

    Thanks in advance.

Viewing 9 replies - 1 through 9 (of 9 total)
  • Can you post a link to your site for reference?

    Thread Starter getaheadsolutions

    (@getaheadsolutions)

    Hi Justin – thanks for the reply.

    link is
    http://www.kathyskitchen.uk/

    That looks to be the correct selector. You could try adding more specificity to it.

    .site-branding .site-title {
             font-family: "Playfair Display",Georgia;
    }
    Thread Starter getaheadsolutions

    (@getaheadsolutions)

    Thanks Justin – have tried that but sadly doesn’t make any difference (changed the font family obviously!) also tried it to increase the size of the font to 100px just to see if it was working but it doesn’t.

    Back to drawing board……

    It looks like the “Playfair” font is set on the site-title. You could try going one level deeper and select the anchor tag.

    .site-branding .site-title a{
             font-family: "Playfair Display",Georgia;
    }
    Thread Starter getaheadsolutions

    (@getaheadsolutions)

    Hmmm – tried that and few other options but no luck yet!

    Theme Author Shaped Pixels

    (@shaped-pixels)

    Good morning everyone…just starting my day here so I thought I would help out here.

    The selector that Justin pointed out is correct…this is the theme’s site title styling:

    .site-title {
        margin: 0;
        font-family: "Playfair Display",Georgia;
        font-weight: 400;
        font-size: 3rem;
        font-style: italic;
        color: #fff;
        line-height: 1;
    }

    Playfair Display is the font, and if that isn’t available, Georgia is used. Changing the font can be done like this example using Arial and a follow up sans-serif.

    .site-title {
        font-family: Arial, Sans-serif;
    }

    That should be working because I just tried it in the browser tools by changing your site title. As for font size, I know this seems odd that I applied the size to the link part of the title, but this will change the size:

    .site-title a {
    font-size: 2rem;
    }

    **I use rem’s for font size, but you can use % or em (try to avoid using px).

    What font were you wanting to use for the Site Title?

    Theme Author Shaped Pixels

    (@shaped-pixels)

    I believe I have found your problem. Your custom CSS has this:

    #main {
        padding-top: 0.25%;
    
      #banner .aligncenter {
    margin-bottom: 220px;
        }
        .site-branding .site-title a{
             color: blue;
    }

    You are missing the closing curly brakcet } on the first one for #main

    Thread Starter getaheadsolutions

    (@getaheadsolutions)

    Thank you – yes ineed it was the missing } that caused all the problems!

    In the end I haven’t changed the font – I forgot till I saw it on another computer that the font I was using wasn’t standard and therefore wouldn’t display if not installed so for now have simply turned off the Site Title and am using an image instead.

    Thanks again for the wonderful support.

    Kathy
    http://www.kathyskitchen.uk/

Viewing 9 replies - 1 through 9 (of 9 total)

The topic ‘Site Title Font’ is closed to new replies.