Как мне использовать product.media.size для возврата целого числа для использования в массиве product.media

#shopify

#Shopify

Вопрос:

Я надеялся, что смогу использовать product.media.size для возврата целого числа, которое будет использоваться при получении мультимедиа по индексу. Вот что я использую сейчас:

 {% if product.media.size > 9 %}
  <div style = "padding-bottom: 15px">
      <div class="row">
        <figure style = "margin: 0px">
    <img class = "column" src="{{ product.media[8] | img_url: '500x500'}}">
        </figure>
            <figure style = "margin: 0px">
    <img class = "column" src="{{ product.media[9] | img_url: '500x500'}}"> 
            </figure>
      </div>
        <div class="row">
    <img src="{{ product.media[10] | img_url: '1000x1000'}}">
      </div>
  </div>
  {% endif %}
  

Но я хотел бы сделать что-то подобное, если это возможно, но в настоящее время оно не работает

 {% if product.media.size > 9 %}
  <div style = "padding-bottom: 15px">
      <div class="row">
        <figure style = "margin: 0px">
    <img class = "column" src="{{ product.media[product.media.size-2] | img_url: '500x500'}}">
        </figure>
            <figure style = "margin: 0px">
    <img class = "column" src="{{ product.media[product.media.size-1] | img_url: '500x500'}}"> 
            </figure>
      </div>
        <div class="row">
    <img src="{{ product.media[product.media.size] | img_url: '1000x1000'}}">
      </div>
  </div>
  {% endif %}
  

Комментарии:

1. Я бы посоветовал вам ознакомиться с этим руководством .

Ответ №1:

В liquid - знак не используется для вычитания чисел, вы должны использовать minus фильтр, вот фильтры Liquid math.

Я не уверен, что это {{ product.media[product.media.size | minus: 2] | img_url: '500x500'}} сработает.

Итак, я присвоил нужные вам числа переменным, это должно сработать:

 {% if product.media.size > 9 %}
  {% assign media_size = product.media.size %}
  {% assign media_size_minus_2 = media_size | minus: 2 %}
  {% assign media_size_minus_1 = media_size | minus: 1 %}
  
  <div style = "padding-bottom: 15px">
    <div class="row">
      <figure style = "margin: 0px">
        <img class = "column" src="{{ product.media[media_size_minus_2] | img_url: '500x500'}}">
      </figure>
      <figure style = "margin: 0px">
        <img class = "column" src="{{ product.media[media_size_minus_1] | img_url: '500x500'}}"> 
      </figure>
    </div>
    <div class="row">
      <img src="{{ product.media[media_size] | img_url: '1000x1000'}}">
    </div>
  </div>
{% endif %}