Loops

With loops you can iterate through the elements of a list.

For loop

This example uses the for loop to iterate through the elements of the placeholder {{ FeaturesArray }}:

<ul>
    {% for feautre in FeaturesArray %}
      <li>{{ feature }}</li>
    {% endfor %}
</ul>

Examples

Image gallery

This example shows how to use the for loop to display all product images contained in the placeholder {{ ImageSetsArray }}:

{% if ImageSetsArray is not empty %}
    <h4>Gallery</h4>
    <div class="asa2_gallery">
    {% for imgSet in ImageSetsArray %}
        <a href="{{ imgSet.LargeImage.URL }}" rel="lightbox[{{ ASIN }}]"><img src="{{ imgSet.MediumImage.URL }}" /></a>
    {% endfor %}
    </div>
{% endif %}

Note: The parameter rel="lightbox[{{ ASIN }}]" prepares the images for the use with lightbox plugins.

Three column design

This is an example of how to split an array into three parts and show the values in three columns. It uses ASA2’s custom filter divide.

<div>
    {% for part in FeaturesArray|divide(3) %}
        <div style="float: left; width: 33%;">
            <ul>
                {% for column in part %}
                <li>{{ column }}</li>
                {% endfor %}
            </ul>
        </div>
    {% endfor %}
    <div style="clear: both;"></div>
</div>