Section 4: setting with id="tan_pearl" default is invalid

Topic summary

Main issue: Adding a custom font (TAN-PEARL) to a Shopify theme via a font_picker causes the error: “Section 4: setting with id="tan_pearl" default is invalid” when editing settings_schema.json.

What was tried: The font file (.woff) was uploaded to Content/Files and theme.liquid was updated. A helper suggested correcting @font-face and ensuring the settings default matches the font name exactly.

Key guidance provided:

  • Use @font-face with file_url since the font is in Content/Files, not Assets.
  • Ensure the font-family string has no spaces and exactly matches the default value used in settings_schema.json.

Current status: After applying the changes (updated @font-face and matching names), the same error persists. No confirmed fix yet.

Unanswered questions:

  • Exact cause of the “default is invalid” error (e.g., whether the default must match one of the font_picker’s allowed values or a schema format issue).
  • Best practices for editing settings_schema.json and how to prevent future Shopify updates from overriding custom settings.

Notes: Resolution likely depends on the precise schema/default configuration shown in the screenshots (code snippets are central).

Summarized with AI on January 5. AI used: gpt-5.

Hi,

I am working on a Shopify store where I need to integrate custom font called TAN-PEARL. I’ve uploaded the ‘woff’ file in Content/Files section, Updated the theme.liquid file as well.

Now, I want to add font_picker in the Typography section in theme setting but I am unable to do so. I tried updating setting_schema.json but getting this error – ‘Section 4: setting with id=“tan_pearl” default is invalid’.

Also, I wanted to understand if updating setting_schema.json comes under best practice or not. If not what is the best way to do that?

How I can make sure that Shopify store updates does not affect these settings in future?

Following are code snippets of the changes I did till now:

Please help!!

Regards

Dev

Actually, it looks like two things. Here is how your “@font-face” should look:

@font-face {
  font-family: 'TAN-PEARL';
  src: url('{{ 'tan-pearl.woff' | file_url }}') format('woff');
}

the font-family should not have any spaces and should be identical to what you use in the “default” value in your settings_schema.json and you should be using the | file_url filter since you uploaded the font to your contents and not assets.

1 Like

Sorry, I missed that the first time.

Hi, Thank you for the response.

I changed the configuration as per your recommendation. However the error still persists. Could you please check?

Thanks