[Resolved] Change post titles to h2

This topic contains 13 replies, has 2 voices, and was last updated by  Andrew Misplon 3 months ago.

  • Author
    Posts
  • #9763

    Caducken
    Participant

    Hi there
    It seems that the post titles in Polestar are set to h1, which doesn’t work for me, I’d like them to be h2 (which is WordPress convention). How can I adjust the CSS to make this happen?

    #9764

    Andrew Misplon
    Keymaster

    Hi 🙂

    Are you asking about single posts and pages? h1 is correct for the post title in that case. Here is _s as an example, perhaps the most vetted WordPress theme there is:

    https://github.com/Automattic/_s/blob/master/template-parts/content.php#L16

    #9765

    Caducken
    Participant

    Hi Andrew
    Cool, I have been looking in the Polestar template for that sort of setting but it isn’t as clear as the example you’ve given me.
    I have h1 text embedded into a parallax image as my page header and I use a different font than the one I’d like to have as my post titles, so making post titles h2 is a good fix. Is it possible? I assume there’s some custom css I can use?

    #9766

    Andrew Misplon
    Keymaster

    Thanks for the information. The link I sent isn’t a setting, just the source for a theme using h1 as post titles. CSS can’t change HTML markup. Please, send me a link to the page concerned and I’ll take a look.

    #9767

    Andrew Misplon
    Keymaster
    #9768

    Caducken
    Participant
    This reply has been marked as private.
    #9769

    Andrew Misplon
    Keymaster

    Super, thanks for the details. h1 is correct on the single post page though. I’m not following why you’d want to change it. The page needs one h1 tag.

    #9770

    Caducken
    Participant

    So every page needs at least one use of h1?
    I want to change it because I’m a type nerd and want my post headers to be Source Sans Pro like the rest of the post and only use Raleway bold for the header images… it’s a bit clunky in the lower case mode for post titles :}

    • This reply was modified 3 months ago by  Caducken.
    #9772

    Andrew Misplon
    Keymaster

    Sure, add to Customize > Additional CSS:

    .site-content .entry-header .entry-title {
    	color: #2d2d2d;
    	font-family: 'Source Sans Pro';
    	font-size: 29px;
    }

    Adjust the colour value and font size value as required.

    Every page needs an h1 tag, ideally, yes.

    #9773

    Caducken
    Participant

    Almost there — how can we add something about taking out the extra letter-spacing, which is still inherited from the h1 text (and looks way too spacy)? It’s doing what I want though, thanks!

    • This reply was modified 3 months ago by  Caducken.
    #9775

    Andrew Misplon
    Keymaster

    Sure. The letter spacing is being added by Easy Google Fonts plugin. One option is to remove it from the EGF settings, unless you need it elsewhere. The way it’s been added to Easy Google Fonts means it will impact every h1 tag in the site. The theme isn’t adding the letter spacing.

    Or you can add it to the Additional CSS rule:

    .site-content .entry-header .entry-title {
    	color: #2d2d2d;
    	font-family: 'Source Sans Pro';
    	font-size: 29px;
    	letter-spacing: normal;
    }

    letter-spacing: normal

    #9776

    Caducken
    Participant

    Thanks. Yes, I realised when I added it (the spacing) that it was affecting every h1 tag, but it works very well on the headers. It’s going to be good to have this bit of customising! Many thanks again, Andrew.

    #9777

    Caducken
    Participant

    PERFECT. Top marks again, great support.
    Thanks Andrew.

    #9778

    Andrew Misplon
    Keymaster

    Glad to hear you’ve made progress 🙂

Viewing 14 posts - 1 through 14 (of 14 total)

You must be logged in to reply to this topic.

Scroll to top