App integrations, styling changes, theme enhancements—there are many reasons to modify the theme files. However, theme file customizations are a common obstacle for merchants when updating to the latest version. This article presents some strategies and best practices for preparing, migrating, and restoring custom theme file modifications in an updated theme version.
Preparing for the update
Duplicate your current theme
First, select Actions > Duplicate to create a backup of your theme. This will serve as a backup reference in case any changes are lost.
Check which apps are in use
Apps often need to connect with the store's theme through modifications to the theme files. This can be automatic, manual, or a task performed by the app's development team. It is important to look at which apps are being used to determine if integration with the new theme will be automatic or requiring action.
Identify which files have been modified
In the current theme, go to Actions > Edit code to access the theme files. In this view, there should be small circles to the left of the theme file names if modifications have been made.
Another sign that a theme file is modified can be found when opening a particular theme file. If we open the theme.liquid, for instance, there will be a link at the top labeled Older versions. This can be used to revert the theme file back to a previous state. This feature only appears for certain files.
Take note of the modified file names—these will likely need to be modified in the new version.
Migrating custom content
There are two routes for updating a theme. One is to use the Theme Updater App. This app will carry over content and settings from a previous (compatible) version. If Preserve customizations is selected, the app will carry over as many modifications as possible to the new version.
Another route is to update manually. This is achieved by adding the latest version to your Online store and copy-and-pasting the content from one theme editor (original theme) to another (new theme).
For more information on these approaches, check out How to update your Shopify theme
Once you have the latest version in your store, whether filled out by the Theme Updater App or a fresh start, begin by creating one tab/window for the old theme and another for the new theme. Then open Actions > Edit code for both windows/tabs
Compare files
Use the online tool Diffchecker to compare your theme files:
Copy and paste the liquid file that you believe had custom code added to it into the Original Text field. Then copy and paste the corresponding file of the new version into the Changed Text field. Click Find Difference.
In the Original Text field, any code that does not appear in the Changed Text field will be highlighted in red (this will include changes we've made to the theme, but of course you only need to worry about copying over custom code additions you've made).
Update theme settings (Updating manually)
Open the theme editor for both unpublished versions of the theme in separate windows (to do this, right-click the Customize link next to each theme).
By placing them side-by-side in separate windows, you can go section by section and match the settings and content.