Shopify tablerow loop exiting early - html

Question

I'm looping through my collection of frontpage products and generating a table. In the last row, I need to put some static content in the first table cell. I've been able to do that, but for some reason, the loop stops after it does that. Does anyone know why?
{% tablerow product in collections.frontpage.products cols: 2 %}
{% if tablerowloop.col_first and tablerowloop.last %}
<img src="{{'box.png' | asset_url}}">
{% else %}
<div class='featured-product'>
<img src="{{ product.images[1] | product_img_url: 'medium' }}">
<p>{{ product.title }}</p>
</div>
{% endif %}
{% endtablerow %}
Here's the site: https://hodkiewicz-zieme-and-hirthe180.myshopify.com/

Answer 1

tablerowloop.last only returns true for the last cell of the table (i.e. last product of the collection), not for the last row. Instead you need to check if the index within cols of the end of the collection, such that it must be the last row if it is the first column.
{% tablerow product in collections.frontpage.products cols: 2 %}
{% assign x = tablerowloop.length | minus:2 %}
{% if tablerowloop.col_first and tablerowloop.index > x %}
<img src="{{'box.png' | asset_url}}">
{% else %}
<div class='featured-product'>
<img src="{{ product.images[1] | product_img_url: 'medium' }}">
<p>{{ product.title }}</p>
</div>
{% endif %}
{% endtablerow %}