Shopify Reference Theme not working

Store Design

Topic summary

The Shopify Reference Theme from GitHub fails to render properly when installed via CLI preview or direct upload to Shopify admin.

CLI errors indicate schema validation issues with custom setting types like style.layout_panel and style.spacing_panel in the theme’s block files. The error message states these setting types are invalid.

Root Cause Identified:
The Reference Theme requires a development store with the “Flex sections” developer preview feature enabled to function correctly. This requirement is not documented in the Shopify Academy course that references this theme.

Resolution:
Create a new development store with “Flex sections” enabled in developer preview settings. Standard stores lack support for the custom style panel setting types used throughout the theme.

Shopify support declined to assist as the user is a developer rather than a merchant, directing them to community forums instead.

Summarized with AI on November 1. AI used: claude-sonnet-4-5-20250929.
1

Hi,
I installed Shopify Reference Theme from https://github.com/Shopify/reference-theme/tree/main. It does not work.
I tried using Shopify CLI Preview and also uploading the theme directly in shopify admin, both ways don’t render properly. In CLI i get errors that some files could not be deleted. I used Accelerator Theme previously and everything was working properly(and still is). Any ideas?

2

check if the theme is not properly installed, verify your theme ID, clear your browser cache, try accessing the theme in incognito mode, and if the issue persists, contact Shopify support to diagnose the problem further..

Thank you!!!

3

@kjasniok
Have you checked?

4

Yes, I did. theme id is ok, clearing cache and previewing in incognito didn’t help. I see some errors in CLI when trying to access pages so maybe code of this theme is causing errors. Example error in CLI:
blocks/_slide.liquid │
│ │
│ Invalid schema: setting with id=“layout” type is invalid

thats the part of coder referenced in error:
…

"settings": [
  {
    "type": "image_picker",
    "id": "image",
    "label": "Image"
  },
  {
    "type": "style.spacing_panel",
    "id": "spacing",
    "label": "Spacing",
    "default": {
      "padding": "20px"
    }
  },
 **{**
 **"type": "style.layout_panel",**
 **"id": "layout",**
 **"label": "Layout",**
 **"default": {**
 **"flex-direction": "row",**
 **"gap": "20px",**
 **"justify-content": "center",**
 **"align-items": "center",**

 **"@media (--mobile)": {**
 **"flex-wrap": "wrap"**
 **}**
 **}**
  }
],

…

This theme is supposed to showcase usage of theme blocks, but looks like it has some bugs?

I contacted Shopify support earlier but they didn’t provide any help because I’m a developer, not a merchant so they just said i should ask here on community.

5

I had the same issue. If you’re like me, you got to this point by following this course in the Shopify Academy.
https://www.shopifyacademy.com/theme-architecture-with-liquid-for-developers-new/2098663

If so, it’s not documented in there, but you need to create a new development store with “Flex sections” developer preview enabled.

1 Like
6

Yup, that’s exactly why I was asking about that theme. Thanks for the answer, I finished the course already without really testing the reference theme but maybe someone else going through the course won’t waste time trying to figure out why it doesn’t work.