Pregunta

I am trying to list a load of products, and insert an image between the second last and the last item. At the moment I have this code on my index:

         <ul class="clearfix">
          {% for product in collections.drinks.products %}
          {% include 'snippet-product-item' with 'four' %}
          {% endfor %}
        </ul>

This in my product-item:

{% if snippet-product-item == '' %}{% assign snippet-product-item = 'four' %}{% endif %}

<li class="{{ snippet-product-item }}-per-row clearfix">
  <div class="coll-image-wrap{% unless product.available %} sold-out{% endunless %}"> 
    {% if product.available == false %}
    {% assign ratio = settings.product_img_w_to_h_ratio | times: 1.0 %}
    <a href="{{ product.url | within: collection }}">
      <img src="{{ product.featured_image.src | product_img_url: 'large' }}" alt="{{ product.featured_image.alt | escape }}" />
    </a>
  </div><!-- .coll-image-wrap -->
</li>

So I'm guessing I need to put some code in my index block to work out how many items there are in the collection, and then for the last one add an extra image in before it. Can anyone help me figure out how that might be done please?

This is my useless attempt:

{% assign num = 0 %}     
{% for product in collections.drinks.products %}            
//Do something like this to work out number of items in collection
{% assign num = temp %}
// Then minus one and insert the image so it appears between second to last and last items
{% endfor %}
¿Fue útil?

Solución

I would try something like this:

{% for product in collections.drinks.products %}
   {% if forloop.last %}
        // Insert image...
   {% endif %}
   {% include 'snippet-product-item' with 'four' %}
{% endfor %}
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top