How to fix automatic changes in duplicated image-with-text sections?

Technical Q&A
1

I created a new custom page and added two image-with-text section. Changes in one automatically change the other section and the second image-with-text section is not accessible.

Any Support will be appreciated!!

– custom page code–

{% section ‘image-with-text’ %}
{% section ‘image-with-text’ %}
{% section ‘collapsible-content’ %}
{% section ‘rich-text’ %}

2

Hi @Shubham_adwit
Yes, it is correct behavior of shopify themes.
This is because Shopify saves all section data from all liquid templates in the settings_data.json : https://shopify.dev/themes/architecture/config/settings-data-json

Shopify stores the data for sections by section name in single file (excluded index page) so if you have multiple sections with the same name - it will related to the same data.

For now we have 2 different ways to solve this problem:
1 - use json template (shopify 2.0) for pages. In this case all data should be stored on the template (instead settings_data) and all sections will be related to the data by uniq id instead section name.

2 - create new section with different name {% section ‘image-with-text-2’ %} and use it in liquid template.
If you care about code duplication, you can create snippet and use section only for providing necessary uniq data.

1 Like