quiero subir video en mi tienda shopify mi codigo tiene for loop
<div class="product-slider-show"> <div class="owl-carousel"> {% for image in product.images %} <div class="swiper-product-image"> <a class="cloud-zoom-gallery sub-image" id="product-image-options-" href="{{ image.src | img_url: 'master' }}" title="{{ featured_img_alt }}" rel="useZoom: 'product-cloud-zoom', smallImage: '{{ image.src | img_url: 'master' }}'" data-pos="{{ forloop.index }}"> <img {% if settings.lazyloading_enable %} class="lazyload" data-{% endif %}src="{{ image.src | img_url: 'master' }}" title="{{ featured_img_alt }}" alt="{{ featured_img_alt }}" /> </a> </div> {% endfor %} </div> </div>Cuando agrego video html a este código, el video aparece junto a cada imagen.
¿Qué código debo usar en este ciclo for, para que el video pueda aparecer solo al final?
si alguien más tiene este problema. Este código fue mi solución.
{% for image in product.images %} {% if forloop.first == true %} <figure> <img src="{{ image.src | img_url: '1024x1024' }}" alt="{{ image.alt | escape }}" class="product_variant_image"> </figure> {% else %} <figure> <img src="{{ image.src | img_url: '1024x1024' }}" alt="{{ image.alt | escape }}"> </figure> {% endif %} {% endfor %} {% for media in product.media %} {% if media.media_type == 'video' %} {{ media | video_tag: controls: true, preload: true, image_size: "768x" }} {% endif %} {% endfor %}