Different section options for different pages with same sections

Highlighted
New Member
3 0 2

I am new to Shopify (been building on Wordpress for a few years). I have created several sections for the home page. I now want to make several landing pages that have the same sections as the home page but different values. 

i.e. Home page h1 -> 'My Home Page'. Landing page 1 h1 -> 'My Landing Page 1'

I have copied all the sections to me page.landing.liquid and created several page using this template but whenever I change the sections value of the one section using the theme editor, it changes the value on all the pages. 

Does anyone have any advice on how to best achive this in Shopify?

2 Likes
Highlighted
Shopify Expert
2684 67 841

You will have to duplicate your Sections to make them different on different pages, unfortunately.

https://help.shopify.com/themes/development/theme-editor/sections#static-sections

 

Want to hire me to tweak a theme? Mail me at tairli@yahoo.com!
My post solved your problem? Like it!
I am away till Feb-15.
0 Likes
Highlighted
Shopify Partner
106 1 16

It's an annoying to have to replicate code.  I have a custom banner section that I want to use on a generic page.template but have to create a template for each unique page.

It looks like a section needs a unique schema name to be processed and stored into settings_data.json - if that is the case if we could use a variable in the JSON for the schema name, we should be able to reuse sections with the use of  snippets?

The barrier to this idea is that {%schema%}  tag can only contain static json, but a tweak to the schema tag to allow a variable to be passed, just like the {%include%} tag would open this up:-

ie. {% schema, schema_name: page.title %}

So, in the concept below I have a section to display a banner (with the associated user settings) that is called from a generic page.template.  The objective is that I can apply the template to any page without having to create a unque section every time - and replicating the same code.  A unique schema name should allow me to reuse the section code for each page.

/*
FILE: /theme/templates/page.liquid
*/

{% section 'my_reusable_section' %}
/*
File: /theme/sections/my_resuable_section.liquid

Typical Section Code: Probably a reusable snippet
*/

{% include 'my_resusable_banner_snippet' %}


/*
Dynamic Schema: In the schema tag below we pass the page.title as the unique name of the schema, which is picked up by the included JSON snippet 'my_reusable_schema'
*/

{% schema, schema_name: page.title %}

     {% include 'my_reusable_schema' %}

{% endschema %}

The reusable section code:

/*
File: /theme/snippets/my_resuable_banner_snippet
*/

{%  if section.settings.show_banner_image %}
  
   <div class="banner_image">

   {% if section.settings.show_title %}
      <h1>{{page.title}}</h1>
   {% endif %}

   </div>
{% endif %}

And in the schema snippet 'my_reusable_scema.liquid' we have a standard JSON object with the dynamic name variable passed (which probably won't work with double braces {{ obviously - but you get the idea).

/*
FILE: /theme/snippets/my_reusable_schema.liquid
*/
{
	"name": {{schema_name}},
	"settings": [{
			"type": "header",
			"content": "Image Banner"
		},
		{
			"type": "checkbox",
			"id": "show_banner_image",
			"label": "Show banner",
			"default": true
		},
{
			"type": "checkbox",
			"id": "show_title",
			"label": "Show title",
			"default": true
		}
]
}

 I haven't given this too much thought and don't know if it is viable, but if so perhaps we can ask the shopify devs to enhance the {%schema%} tag.

My enthusiasm greatly exceeds my talent.
3 Likes
Highlighted
Shopify Expert
92 0 6

Please!

http://reconfigure.ca
0 Likes
Highlighted
Excursionist
92 0 4

Any update on this? Kind of brutal to create dozens of section files in order to reuse the same section

0 Likes
Highlighted
Shopify Partner
7 0 4

I agree with this very hard. What is the point of releasing the API in this form? It's unusable. 

1 Like
Highlighted
Shopify Partner
1 0 1

Has there been an update on this yet?

1 Like
Highlighted
Shopify Partner
4 0 7

Would love it if Shopify responded, and included this functionality!

2 Likes
Highlighted
Shopify Partner
14 0 3

Hello everyone!

It is so lame that dynamic sections aren't yet a thing outside the homepage. That being said, our team has a workaround we use for clients. We just add HTML markup to the page, collection, or product description that differentiates how the content should be displayed. For example, we have a collection template that leverages HTML classes in the collection description to determine where to display the content. 

For example, the following HTML in the collection description would display one sentence at the top of the collection page and the other at the bottom:

<section class="collection-top-content">
  <p>This appears at the top of the page!</p>
</section>
<section class="collection-bottom-content">
  <p>I'm all the way down on the bottom of the collection!</p>
</section>

Then you just need to adjust your collection.liquid template to split the content based on those classes!

We've also used HTML comments to split content on product pages. For example, we used the following tag to split the product description:

<!--read more-->

Everything before that tag would display at the top, and everything below would be stashed in a modal or tab at the bottom of the page! 

It's definitely not dynamic sections, but it works great for some of our biggest clients! No theme file editing needed - just some old fashion HTML skills, which basically everyone has these days. ;p

Hope that helps!

0 Likes
Highlighted
New Member
1 0 1

Another issue that I've personally run into with this is when you create numerous files for each page, it'll bog down the customizer to the point where it doesn't even open. I really hope they can come up with a fix regarding this soon. 

1 Like