Add an Adobe Font to the Theme Editor

Technical Q&A
, , , ,
1

Hi, does anyone have an idea how to add an Adobe Font to the Theme Editor? I want to be able to choose the Adobe Font from the Theme Editor’s typography list, just as I can choose any of the fonts included in Shopify. I use the Dwell Theme.

I don’t want to manually adjust the code every time I use the Adobe Font.

Thanks in advance!

2

Hi @fm_vlv,

You want to integrate external fonts for font_picker, this is not possible.

You can only add it manually or add an option in Customize and call it code in theme.liquid file.

Hope it is clear to you

3

Hi @fm_vlv,

Great question, this comes up quite a bit when store owners want to bring in Adobe Fonts and still keep things manageable inside the Theme Editor.

Unfortunately, Shopify’s Theme Editor doesn’t natively integrate with Adobe Fonts the same way it does with Google Fonts. That’s why you don’t see Adobe Fonts in the typography dropdown by default. But you can absolutely add them in a way that doesn’t require you to re-edit code every time. Here’s a workflow that usually works well:

  1. Get the Adobe Embed Code

    • In your Adobe Fonts account, generate a web project and copy the embed <link> or script they provide.

  2. Add It to Your Theme

    • Go to your Shopify admin → Online Store → Themes → Edit code.

    • Open theme.liquid (under Layout) and paste the Adobe Fonts embed code inside the <head> tag.

  3. Create CSS Classes for Your Adobe Font

    • In base.css (or theme.css depending on your theme), declare your Adobe Font like this:

      .adobe-font {
  font-family: "Your Adobe Font Name", sans-serif;
}

  4. Make It Available in the Theme Editor

    • Shopify’s Theme Editor can’t “magically” show Adobe Fonts in the dropdown, but what you can do is assign the .adobe-font class to certain sections/typography settings. That way, once it’s linked, you don’t need to keep editing raw code. You just select the style or section where you applied the class.

If you also like, I can walk you through the schema edit step-by-step, it’s not something too hard once you see it.

4

Unless Shopify permits the loading of third-party fonts, merchants cannot select fonts from external apps or plugins within Shopify themes. Therefore, this requirement is currently difficult to implement.