Use dynamic sections in other pages

Solved
Highlighted
Tourist
3 0 1

I am new to Shopify and I have started building my website.

 

I having some difficulties understanding how to create a dynamic section on pages that are not the index.

I have a section that I created called "Parallax", as you can imagine for the theme editor you can upload an image and the result is div with the image with a parallax effect.

 

Now I want to reuse this section whenever I want, so for I have in the index and two other pages (product and collection list), and all three should have different images.

 

The problem is that the index page is the only that shows correctly the image I want, since from what I understood the section in the Index are independent, while there other two sections share the same instance, so I cannot use different images for two different pages.

 

How can I go around this restriction? I could copy paste the code in every page but it is really impractical, since if I have to change something then I would have to change every page.

 

Should I maybe use Snippets instead?

 

Edit: sketch of what I want https://i.imgur.com/iwc2C0H.png

0 Likes
Highlighted
Tourist
3 0 1

Sure, here is a minimal sketch https://i.imgur.com/iwc2C0H.png

 

3 different pages containing the same section (parallax), in the section you can set from the theme editor an image to upload. 

 

So each page should have a different image, but it seems that is not possible using only sections since they share the same instance!

 

0 Likes
Highlighted
Shopify Expert
2684 67 846

This is an accepted solution.

Yes, so far it is not possible, only front-page can have sections added dynamically.

 

However, this is coming (hopefully) soon, check this announcement

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.
Highlighted
Tourist
3 0 1

Thanks Tim!

 

I searched a lot in the forum for a possible solution but everyone was complaining about the lack of this feature, which I find quite shocking that is (was) missing!

 

I missed that article, but that seems promising, guess I will implement a workaround for now and see what comes with the update.

Highlighted
Tourist
4 0 1

You can add the section to other internal pages, you just need to put it there manually.

 

E.g. Create a new page template, and below the page contents add {% section 'slideshow' %} and you'll get the slideshow section on any pages with that template. The gotcha is that they share the same instances of data, so you'll need three for your setup. e.g. you'll have 3 custom page templates cool-page-1.liquid cool-page-2.liquid etc, and each has it's own section/cool-slideshow-1.liquid, section/cool-slideshow-2.liquid etc. More info here.

 

Highlighted
New Member
2 0 0

Hey there not sure if you've solved this yet but it is possible!

It requires a little manual editing. Go into your 'edit code' area and make a new 'section'. Then go to the 'parallax' section that you want to duplicate. Highlight everything and copy/paste into your new section that you created. Then simply insert this new section into your template/page by adding this code {% section 'new-section' %}. 

That should take care of it. The reason why this works in creating different image instances is because the data in sections is not global but specific to your new section. 

Hope that helps!

bp

0 Likes