What's the fastest way to fix a broken eCommerce template preview in Shopify 2026?
First things first: roll back to your last stable theme version. Then clear your theme cache before you touch anything else. Honestly, this is the best way to avoid compounding the problem.
Quick Fix Summary
- From your Shopify admin, go to Online Store > Themes.
- Next to your published theme, click Actions > Duplicate.
- In the duplicated theme, click Actions > Edit code.
- Open
settings_schema.json and settings_data.json, compare the JSON with your backup, then save.
- Click Actions > Publish and hard-refresh the storefront (Ctrl+F5 / Cmd+Shift+R).
What's causing my Shopify template preview to break after saving changes?
Shopify’s online theme editor (2026) bundles Liquid, JSON, CSS and JavaScript together every time you hit Save. If that bundle grows beyond 50 MB or tries to reference a deleted asset, the preview fails—and your storefront might show a broken layout. The safest fix? Revert to the last working theme revision before you made any edits.
How do I duplicate my live theme safely?
Start by logging into your Shopify Admin. Head to Online Store, then Themes. Find your currently published theme, click Actions, then Duplicate. A new theme called “[YourTheme] – copy” will appear—this is your safety net.
Which JSON files should I compare after duplicating my theme?
In your duplicated theme, click Actions then Edit code. Open both config/settings_schema.json and config/settings_data.json in the editor. Now open a second browser tab, go to your original theme, click Actions, then Download to grab the last working copies of those files. Use a diff tool (VS Code’s built-in viewer works great) to spot any added or removed settings.
What’s the safest way to merge changes from my broken edits?
Reintroduce only the settings you actually need, then save both JSON files. If you used the theme editor, check templates/*.liquid for new sections—copy over the blocks you created into your duplicated theme. Don’t rush this step; precision matters more than speed.
How do I publish my fixed theme and clear the cache?
Go back to Themes, find your duplicated theme, click Actions, then Publish. Now clear your browser cache: press Ctrl+Shift+R (Windows/Linux) or Cmd+Shift+R (Mac) to bypass the CDN cache. That hard refresh ensures visitors see your fixed layout right away.
What if my template preview still looks broken after trying these steps?
If the preview’s still not working, try restoring from a theme backup. If you enabled Theme Checkpoint (Shopify 2025+), you can revert to any of the last 30 daily revisions via Actions → Revert to this version—no coding required.
How can I restore my theme without losing recent work?
If you’ve got Theme Checkpoint enabled, use Actions → Revert to this version to roll back to a stable point. Otherwise, download the original .zip from Shopify Partners Marketplace (if you bought the theme) or grab it from Dawn releases on GitHub if you used the free theme. Upload via Themes → Actions → Upload and publish.
Is there a way to push my local theme files directly to Shopify?
Yes—install Shopify CLI 3.0, then run shopify theme push --force to overwrite the live theme with your local working files. Just make sure you’re using Node.js 20 or higher first.
How can I prevent template preview breaks in the future?
Start by enabling version control. Add a .shopifyignore file to exclude large asset folders, then run git init in your theme folder. Push everything to GitHub or GitLab so you can review changes before they go live.
What’s the best way to test template changes before they go live?
Set up a staging theme. Create a development store linked to your main store via Shopify Partners → Stores → Connect store. Test every template change in the staging environment first—only merge to live once you’re confident it works.
How do I keep my theme assets from bloating the bundle?
Run shopify theme check locally to catch oversized images or duplicate assets. Before uploading, compress images with Squoosh or imgproxy. Since Shopify’s CDN serves WebP automatically (since 2025), upload only high-res JPG/PNG files to keep things lean.
Does Shopify keep automatic backups of my theme?
Yes—since Shopify 2026, every published theme retains 30 daily snapshots. You can revert in two clicks via Themes → Actions → Revert to this version without restoring from backup. That’s a lifesaver when things go sideways.
What’s the quickest way to revert to a working theme version?
If you’re on Shopify 2025 or later and have Theme Checkpoint enabled, go to Themes, click Actions on your published theme, then choose Revert to this version. It’s the fastest way to undo recent changes without losing progress.
Can I use Shopify CLI to deploy changes without publishing first?
Not quite. shopify theme push --force overwrites the live theme directly, so there’s no staging step. Use it only when you’re certain your local files are correct—otherwise, test in a staging theme first.
Edited and fact-checked by the TechFactsHub editorial team.
