Topic: Global Styles & Custom Variable Font Weights

teleiosdesign
May 6, 2024 at 7:49 pm

Hi Team,

I’m currently building this new site on InstaWP: https://candid-quail-c45223.instawp.xyz/ (Coming Soon page).
It’s based on a Starter Site from Mike Oliver’s Website Collective.

However, I’m trying to get custom font weights work with exisiting Global Styles. For the body I’m using a variable version of Barlow. Its weights vary between 22-188 which doesn’t fit the default weight selectors in GenerateBlocks. I’ve tried adding additional CSS in the customiser to override styles—like this:

button–text-icon {
font-weight: 165 !important;
}

But it’s not working.

What would you recommend as the best way of proceeding?

Thanks for your help!
Alvind
May 6, 2024 at 9:06 pm

Hi there,

Do you have this font weight variation uploaded? Typically, font weights are specified in increments of 100.
teleiosdesign
May 6, 2024 at 9:37 pm

Yes, it can be downloaded here: https://tribby.com/fonts/barlow/

I’ve compressed the BarlowGX.ttf file as a .woff2 file online. And I’ve uploaded it locally. Here’s a screenshot of the weight (22-188) and width (300-500) settings that I get when I inspect in Safari: https://candid-quail-c45223.instawp.xyz/wp-content/uploads/2024/05/[email protected]
teleiosdesign
May 6, 2024 at 10:07 pm

I’ll include admin access below 🙂
Alvind
May 7, 2024 at 12:30 am

I cannot pinpoint the cause of why it’s not working. It’s possible that the actual font file with the specified font weight must exist in order to use that particular font weight. Do you know for sure that you have that?
teleiosdesign
May 7, 2024 at 3:14 pm

Thanks for looking into it 🙂

I definitely have the font installed and it’s showing when I preview the site (i.e. used for body copy)—even when using another browser or private tab where I’m not logged in to WP.

This variable font testing site also shows Barlow’s weight range being 22-188: https://v-fonts.com/fonts/barlow

Perhaps I’m just best ditching the variable version of the font for now and just activating a couple of standard weights of Barlow from Google fonts instead?

I’m not sure why they’ve set the weight to a non-standard range (rather than in increments of 100). I’ve had no trouble getting the variable version of Inter to work in the same installation.
Alvind
May 7, 2024 at 8:53 pm

Perhaps I’m just best ditching the variable version of the font for now and just activating a couple of standard weights of Barlow from Google fonts instead?

I think this is the proper action to take now. 🙂

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

You must be logged in to reply to this topic.

Are you a GenerateCustomer?

Just browsing?

Global Styles & Custom Variable Font Weights