I am developing a theme for a client but have hit a brick wall with one specific aspect of the design, which im hoping someone here can help guide me. This isn’t something I’ve seen done before on Shopify and I believe I know why which I will explain below. Im hoping this is possible via a different approach to mine.
The Request.
On the index (homepage) the client wants a carousel system for the whole page referring to the navigation. As an example of this, if the menu contains 3 links, Mens, Women’s, and Kids, then there would be three carousel slides. Each slide would be a different homepage. And on the left and right of the screen would sit the little carousel arrows to slide to the next slide, or using click and drag.
See the attached image as an example.
How I have built it so far.
Within my theme.liquid layout, I have added a carousel system (slick) and in each slide contains the {{ content_for_layout }} tag. This works fine, and as you slide into the next slide it shows the same homepage index layout. I also have a little ‘if’ statement to check the request, if template == index, then show the carousel, else simple just output {{ content_for_layout }}. Which allows all other pages of the site to function as normal.
The Problem.
Because {{ content_for_layout }} renders the page template for the given request, it will always be index.json which is loaded on the homepage. At first I thought I could then include a page template in the other slides. So it would be slide 1 = {{ content_for_layout }}, slide 2 = index.women.json, and slide 3 = index.kids.json.
But I now see you cannot include / render a page template like you can with a snippet.
The issue here is I need all three pages to be customised via the Shopify Customiser so the client can drag and add sections specific to that category. eg a women image banner on the woman’s page etc.
My questions / thoughts for you all.
- Any thoughts on how I can get this to work?
- Is it even possible?
- Remember each of the slide pages need to be customised via the Shopify Customiser.
- Maybe I build the other slides as pages as intended, but use some kind of URL parameter to help change the {{ content_for_layout }}?
Your thoughts and input would be much appreciated.
Thanks
Josh