[Resolved] System Stack fonts – adding additional fonts?

[Baz]

Hi, I’ve seen a few mentions on this forum about the advantages of using the System Stack fonts.

A popular font stack on many websites seems to be:

font-family: -apple-system, BlinkMacSystemFont,
    "Segoe UI", "Roboto", "Oxygen",
    "Ubuntu", "Cantarell", "Fira Sans",
    "Droid Sans", "Helvetica Neue", sans-serif;

So, is it possible to add additional fallbacks to the existing GP System Stack e.g. “Roboto”, “Oxygen” etc ?

Thanks.

[David]

You can use the: generate_typography_system_stack filter to replace the System Stack for whatever you need.

Tom provides an example here:

https://generatepress.com/forums/topic/palatino-linotype-font-not-supported-on-mac-and-apple-devices/#post-1422333

[Baz]

Thanks David, that snippet you linked to worked great.

Am I correct that I don’t need to add any ‘font-family:…’ CSS to apply these updated fonts throughout the theme? I can see the new font-family has been added to ‘(index)’ in my browser inspector.

Also, are there any plans to update the default GP System Stack fonts, or to offer the ability to choose your own system fonts?

[David]

Thats correct no CSS required as the System Stack simply outputs that for you.
We’re planning an entire revamp of the Typography module in a later update, ill see what we can do about editable System Stack 🙂

[Baz]

Thank you David, enjoy the weekend 🙂

[David]

You’re welcome – you too!

[Author]

Posts