Hey,
I am working with the usual product in collection.products, ie:
{%- for product in collection.products -%}
I was wondering if is possible to get the product position with the array? ie: to use this in a flex position?
i would expect it would be something like :
{%- for product in collection.products -%}
int order = product.index
{{generalProductStuff}}
{%- endfor %}
Ideally I would like to use the order in the css so I can set the order of product in the flex, or insert other objects.
Bashed this together but figured I would write out for reference.
so on the collection page, I added the following to the product-item render.
{%- for product in collection.products -%}
{%- render 'product-grid-item', product: product, animation_delay: animation_delay, index: forloop.index, sizes: image_sizes, grid_order: forloop.index -%}
{%- endfor -%}
then in product-grid-item assigned to flex_number, ie:
assign flex_number = grid_order | to_i
the at the start of the div for rendering the product block, i added this to style.
of the main block.
Why i’m doing this… Effectively i am rendering a custom block and wanted to decide where it was going. as my grid is flex, i figured best to give them some order. I could probably also control the sort now of items in a grid irregardless of the sort option (as I have id=handle), but not what I was trying to achieve.
