It is common to encounter situations that require duplicating a Shopify theme. For example, a development version may need to be transferred from a sandbox store to a live store during a launch process. A significant challenge in this process is that, although the theme files remain unchanged, sections or blocks within the theme customizer often lose their content or settings.
If you only have a small handful of sections, then it’s trivial to copy over the missing data manually by copying and pasting using the theme customizer in each theme. But this can become untenable very quickly when you are dealing with a theme that contains many sections, each with a lot of content and settings. You could be facing hours of manual work to do this.
While there is no magic bullet for this problem, we can suggest a much more elegant and efficient solution: JSON.
Inside your Shopify theme, you will find a file inside the config directory called settings_data.json. This is essentially a database file containing all content and settings from the theme customizer. Every piece of content you add or configuration change you make is tracked inside this file. So you can probably figure out where we’re going with this…
Assuming the source and destination themes you want to copy data from and to contain the same sections/blocks (which they will if you are creating a duplicate theme, as discussed in our earlier example), it is possible to copy the JSON between the settings_data.json files in each theme.
The key is to locate the particular object for each part of the section that you want to copy over. We do not recommend overwriting your entire file with the file from the other theme, as it will lose important information specific to your theme that you want to retain. Instead, the correct approach is to only copy over the specific JSON objects that relate to the sections that are missing content/settings in your new theme.
In the following example, the original theme includes a section containing several text fields.
Our new duplicated theme also contains this section, but the two fields are empty because the JSON data that contains the text added in the original theme is missing. So the first thing we do is open the settings_data.json file in our original theme and search for the JSON object associated with this section. The search keywords to use are the section title or the text of one of the fields. Whichever is a unique identifier will work.
With the JSON object identified, all we need to do is copy this object to the settings_data.json file in our new theme. One important thing to be aware of is that you need to paste it into a specific part of the file. You can’t just drop it in at the start or the end of the file because it won’t work. The settings_data.json file is structured in a pre-defined way, with particular parent JSON objects pertaining to the specific areas that the file holds data for. In this case our file uses two top level objects: presets and current.
The current object holds the data relating to the sections. So within that we need to find the object with the key called sections.
This object includes all individual section objects, each identified by a unique numeric key. To add a JSON object for a specific section, paste it as a new line within the parent section's object.
With that done, the theme can find the data for the section within the file and load it into the theme customizer.
There is no longer a need for manual copying and pasting between theme customizers. While you still have to copy and paste the JSON, this is a much faster option, and when you are dealing with a large theme, that can mean the difference between minutes and hours.
