If you refresh Shopify’s Theme Editor 1,000 times a day, just like us, this is for you.
The number is exaggerated. The frustration is not.
Sometimes the storefront preview gets stuck or stops reflecting changes.
Refreshing the entire browser tab usually fixes it, but it also reloads the Shopify Admin shell, the Theme Editor, and the storefront preview together — even when only one part needs attention.
A full reload takes more time, interrupts your place in the editor, and may occasionally lead to another login or verification step.
That is why we built Shopify Theme Editor Refresh Controls: a small tool that refreshes only the part you need.
Two controls for two different problems
This free, open-source Tampermonkey userscript adds two buttons beside Sidekick in the Shopify Theme Editor.
Refresh storefront preview
This button reloads only the active storefront preview.
The Theme Editor stays open, your current template remains selected, and your unsaved editor settings stay available.
Use it when the preview is blank, stale, stuck, or no longer reflecting your changes.
Discard and refresh the theme editor
Sometimes the preview is not the problem.
You may have changed several settings, decided not to keep them, and simply want to return to the last saved theme state.
This button asks for confirmation, discards the unsaved Theme Editor changes, and refreshes the editor from Shopify’s last saved state.
When there are no unsaved changes, the button stays disabled.
Important: This action permanently removes all unsaved Theme Editor changes. It returns to the last saved state, not the theme’s original factory settings.
Who is this for?
This userscript is for people who spend a lot of time in Shopify’s Theme Editor:
- Shopify developers, freelancers, and agencies working across themes and templates.
- In-house ecommerce teams testing content, layouts, and theme settings.
- Merchants who regularly customize and maintain their own themes.
If you regularly switch between templates, sections, and preview states, this was probably built for you.
Install the userscript
This project is:
- FREE
- OPEN SOURCE
- AVAILABLE ON GITHUB
Repository:
https://github.com/CheckoutWorks/shopify-theme-editor-refresh-controls
Installation
1. Install Tampermonkey
2. Install the userscript
Note: Make sure "Allow User Scripts" is enabled.
See: https://www.tampermonkey.net/faq.php?q=Q209
Why not refresh the whole browser tab?
You still can.
This userscript does not replace the normal browser refresh when the entire Shopify Admin page is unresponsive.
It is designed for two more focused situations:
- Reloading only the storefront preview.
- Deliberately discarding the current unsaved editor session.
One click may save only a few seconds.
Repeated throughout a development day, those small interruptions add up.
One less full-page refresh
Use the preview button when only the storefront preview needs to reload.
Use the discard button when you want to remove the current unsaved changes and return to the last saved state.
It is a small tool for one repetitive part of Shopify development.
If it saves a few full-page refreshes — and a little frustration — it has done its job.
Built by CheckoutWorks.
Shopify development tools and technical support for merchants and developers:
Top comments (0)