Archived topic

Resize custom font to mobile viewport

2 replies · Started by jeff on January 29, 2018

Viewing posts 1–3 of 3

January 29, 2018 at 11:58 am #482838

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.

January 29, 2018 at 12:16 pm #482889

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

January 29, 2018 at 2:58 pm #483000

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!

This archived topic is closed to new replies.

Start building better websites today.