[Support request] Font family and variants in headings

Home Forums Support [Support request] Font family and variants in headings

Home Forums Support Font family and variants in headings

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #490590
    Michele

    In Customizing ▸ Typography ▸ Headings, I am able to load selected font families.

    https://docs.generatepress.com/article/google-font-variants/

    However, it seems that the same ones must be loaded across all headings? Also, the font variants don’t correspond to the chosen families. It’s not clear how I could, for example, set these in the Customizer:

    H1 300
    H2 300 italic
    h3 700

    Thanks

    #490705
    Tom
    Lead Developer
    Lead Developer

    Hi Michele,

    If the font family is the same, then the variants will be the same throughout the settings with that same family. That’s because when the call is made to Google, we only call the one font family along with any necessary variants for it.

    Then in each of your settings (H1, H2, H3), you would set the font weight to whatever you want that specific element to use (300, 700 etc..).

    Does that make more sense?

    Let me know 🙂

    #490761
    Michele

    Oops, I used the wrong terms before. I understand that for each heading, one font family is chosen. Within that family, there are variants that can be loaded selectively to improve performance. I was expecting that those variants could then be chosen per heading or that the font weights would mirror the variants and allow the choice there.

    For instance, Roboto offers all these variants:

    • Thin
    • Thin Italic
    • Light
    • Light Italic
    • Regular
    • Regular Italic
    • Medium
    • Medium Italic
    • Bold
    • Bold Italic
    • Black
    • Black Italic

    But the font weights offers:

    • 100
    • 200
    • 300
    • 400
    • 500
    • 600
    • 700
    • 800
    • 900
    • normal
    • bold

    It’s confusing that they don’t match. What choices would I make in the Customizer if I wanted to set

    H1 Regular
    H2 Bold Italic

    Thanks

    #490970
    Tom
    Lead Developer
    Lead Developer

    Ah, I understand. I agree that the experience right now is somewhat confusing.

    Variants were added well after the font weight option, which is why they’re different. Switching it up now would likely be very difficult when it comes to backward compatibility.

    This is something I’d like to address in a future version.

    The font weights should still work the same, but we don’t have an italic option currently. I can help with some CSS for that if you need.

    #558484
    Damien

    Hi Tom,

    I’m having the same issue. Can you help me out with the CSS?
    I want to set it this way:
    H1: Italic + Uppercase + Bold + Underlined
    H2: Uppercase + Bold + Underlined
    H3: Uppercase + Underlined
    H4: Downcase
    H5: Italic

    Regards

    #558661
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Most of those are in the Customizer. Here’s the stuff that isn’t:

    h1 {
        font-style: italic;
        text-decoration: underline;
    }
    
    h2 {
        text-decoration: underline;
    }
    
    h5 {
        font-style: italic;
    }
Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.