[Support request] Resize custom font to mobile viewport

[jeff]

I would like to like to use multiple google fonts on the site I am working on. I can change the system font in the appearance->customize->typography area for the site-wide changes, but when I add another font via @import using Simple CSS the fonts do not scale to a mobile viewport (i.e. 480 wide) like fonts customized through the “appearance->customize->typography” menu.

I need to deploy various fonts on different pages to meet the sites design, and it needs to scale to desktop, tablet and mobile viewports.

1. can I add more items to the “appearance->customize->typography” menu?
a. probably not
2. Is there a css tag I can employ in Simple CSS to allow the fonts to properly scale?
a. I tried VH and VW but I can’t seem to get those tags to work for me.

[jeff]

oops! I can do it using @media screen and (max-width: 600px) and (min-width: 300px) in Simple CSS.

Seems to be working just fine now, but it would be easier (for me) if you had a simpler way of doing it in “appearance->customize->typography”.

Tom, you and you staff have created a very easy to use and “powerful” WordPress tool. 5 stars to you and the people you work with.

jeff

[Leo]

Hi Jeff,

Some of the typography options do have mobile toggle size, like Primary Navigation.

We have plan to introduce more in the future 🙂

Here are the breakpoints we recommend: https://docs.generatepress.com/article/responsive-display/

Glad you are enjoying GP!

[Author]

Posts