How do I show theme styles dropdown at the top of a theme demo for users

Retired Boards Appdev Store Design

Topic summary

Theme demo styles dropdown for preset switching is the main issue.

  • A theme has 4 demo presets defined in settings_data.json, and presets can be switched in the Shopify admin theme editor.
  • Uncertainty remains about how the public theme demo shows a style selector dropdown (like the “Default/Craft” selector shown in Dawn): whether it is added by Shopify automatically or must be implemented in the theme.

Key questions raised:

  • If each preset is customized separately in the admin (after switching styles), will those per-preset customizations automatically appear when a user switches styles in the theme demo?
  • Can the style selector be placed in the main navigation (Home) as a dropdown instead of appearing at the top of the demo page?

No resolution or answers are provided yet; discussion is open. An image is included to illustrate the Dawn style selector UI.

Summarized with AI on February 25. AI used: gpt-5.2.
1

I made 4 demo presets in settings_data.json

In the admin setting style, I am able to switch between presets. But in the theme demo I don’t know if I am the one to set the style dropdown like the Default and Craft in the Dawn them shown below or whether it is Shopify that set it.

dawn-style.png
dawn-style.png1274×525 365 KB

I also want to know two things.

  1. If I switch style in the admin settings and customize the theme for each preset, will it be reflecting like that when a user change style in the theme demo?

  2. Can I set a dropdown in the main navigation menu home to show the styles instead of at the top of the page like it is in the dawn demo?