Howdy!
I’m trying to create a new section for my product page which will adapt responsively to changes in the number of Metafields in a namespace for a given product.
The idea is to have a carousel of slides where the slide content are meta fields. The meta fields will dictate heading, subheading, text copy, container background color, as well as an image.
My thinking is to declare arrays of each namespace, sorting by content type:
namespace: pdp_ingredient_slide_bg_color {keys: 1,2,3,4,5…}
namespace: pdp_ingredient_slide_heading {keys: 1,2,3,4,5…}
namespace: pdp_ingredient_slide_subheading {keys: 1,2,3,4,5…}
namespace: pdp_ingredient_slide_text {keys: 1,2,3,4,5…}
namespace: pdp_ingredient_slide_image {keys: 1,2,3,4,5…}
Such that the arrays are an ordered list of values at those keys as indexes.
Then I would make a container nested for loop for the length of the array, inside of which we would assign variables at the array index of the loop and call them inside of HTML structure where needed.
I have limited knowledge of liquid and am not sure what this syntax looks like in terms of declaring arrays based on metafields or name spaces, or if this is the optimal solution.
Any input is appreciated!
Thanks,
Chase