Fine-tuning font-weight

  • Jan

    (@jandavidhauck)


    3 years, 9 months ago

    I have an issue with fine tuning font weights. I have the Easy Google Fonts plugin installed and use “Montserrat” as my main font.
    In the Typography panel of the Customizer, I can select any font weight from 100 up to 900 as general paragraph font.

    Since I have selected 300 there, I wanted to change the weight of text spans as well, and make it slightly less “strong”, which I have (sort of) accomplished through the following Custom CSS:

    .entry-content strong {
    font-weight: 500;
    }

    However, as I was playing around with settings, I noticed that not all weights are possible to select:
    100, 200, and 300 all don’t have any effect on how the text is displayed, and instead all result in it being displayed as “300”
    400 and 500 both result in “500”
    and then everything between 600 and 900 results in it being displayed as “600”

    It seems that the plugin may not be not loading all of the weights of the font so I can’t select them with Custom CSS (despite the fact that in the Customizer “Typography” panel I am able to select all the different weights.

    Any idea what could be the issue?

    The page I need help with: [log in to see the link]

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

  • Most browsers never got around to implementing the ability to display all of the font weights that HTML and CSS are able to ask for. Even if the font designer and page creator have provided a given weight, most browsers still only want to display three possible weights at most. I’m not certain that’s the issue here but I suspect so.

    Thread Starter Jan

    (@jandavidhauck)

    I’m not certain that’s the issue here but I suspect so.

    I don’t think it’s a browser issue. Because the browser does display all nine different font weights (from 100 to 900) as long as they are selected as the default in the Typography panel of the Customizer. But not when they are asked for through CSS.

    I’m actually now fairly certain that it’s an issue with the Easy Google Fonts plugin not loading all of the font weights.

    I deactivated the plugin and then added the very same fonts from Google Fonts manually to my site. And now I can select every font-weight that the font has without any issues through my custom CSS. So either the plugin is broken, or I’m not doing something I’m supposed to in order to load all of the weights.

    Plugin Author Sunny Johal

    (@sunny_johal)

    Hi @jandavidhauck
    I’ve just released a new version of the plugin. Could you upgrade and let me know if this fixes your issue. Cheers

    Sunny

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘Fine-tuning font-weight’ is closed to new replies.