How to implement typography settings in my theme?

Hey everyone,

I’m trying to add a “Typography” setting to my theme in Shopify, but I can’t seem to be able to get it to actually update the fonts. Keep in mind I’m pretty new to Shopify theme development so I’m mostly teaching myself through the documentation provided by Shopify.

I’ve added a font_picker type setting to the array in settings_schema.json, which renders the font_picker in the theme settings of the admin customization tab. However, that’s about as far as I get before I begin to struggle with figuring out what to do next. In the documentation, the instructions aren’t very helpful as it only describes a vague idea of what you have to do rather than how you can actually do it.

I need to figure out how to link the value given by the font_picker to the CSS property of my choice, in this case I want it to change the font of all text within the website. Everything I’ve tried has been unsuccessful, and I can’t seem to find any helpful tutorials or information anywhere.

Is anyone able to help guide me through this? I would really appreciate it.

1 Like

Update: I’ve figured out how to reference the font object within a CSS property, however, whenever I try and change the font from the default of the font_picker it reverts back to whatever the fallback font is and won’t update to the new selection.

Can anyone help me with this?

@leoprd

you have just go to theme customization open theme setting Typography it allow only Shopify font if you need custom font please send store url