{% if item.images is not empty or placeholder_images.item.value is not empty %}

    {# Possibly set this to 1 to hide thumbs on items with only 1 image #}
    {% if item.images|length > 0 %}

        <div class="thumbsWrap">

            <ul class="thumbs" data-zoom-gallery="itemImage">

                {% if item.images is not empty %}

                    {% for image in item.images %}

                        <li>
                            <a href="{{ settings.STATIC_URL }}/{{ image_folders['product_folders']['large']['path'] }}/{{ image.name }}"
                                data-large="{{ settings.STATIC_URL }}/{{ image_folders['product_folders']['verylarge']['path'] }}/{{ image.name }}"
                                class="mtcZoomGallery
                                {% if image.default %}
                                    defaultImage
                                {% endif %}
                                {% if image.zoom == false or not settings.IMAGES_ZOOM %}
                                    disableThisItemZooming
                                {% endif %}
                                "
                                title="{{ item.name }}"
                            >
                                <div class="imageWrap">
                                    <img
                                        alt="{{ image.alt ?: item.name }}"
                                        title="{{ item.name }}"
                                        src="{{ settings.STATIC_URL }}/{{ image_folders['product_folders']['thumbs']['path'] }}/{{ image.name }}"
                                        width="400"
                                        height="400"
                                        loading="lazy"
                                    />
                                </div> <!--  .imageWrap -->
                            </a>
                        </li>

                    {% endfor %}

                {% elseif placeholder_images.item.value is not empty %}

                    <li>
                        <a href="{{ item.url }}"
                            title="More views of {{ item.name }}"
                            class="active"
                        >
                            <div class="imageWrap">
                                <img
                                    alt="More views of {{ item.name }}"
                                    title="More views of {{ item.name }}"
                                    src="{{ settings.STATIC_URL }}/{{ image_folders['product_folders']['smallthumbs']['path'] }}/{{ placeholder_images.item.value }}"
                                    width="100"
                                    height="100"
                                    loading="lazy"
                                />
                            </div> <!--  .imageWrap -->
                        </a>
                    </li>

                {% endif %}
            </ul>

        </div> <!--  .thumbsWrap -->

    {% endif %}

{% endif %}

