Связанные продукты Tag в Shopify

Question

Я разработал жидкий шаблон для сравнения тегов текущих продуктов с тегами всех других продуктов в магазине и отображения четырех в качестве родственных продуктов в нижней части страницы.

Это работает, но я думаю, что я сделал это довольно неэффективно. Есть ли способ сделать эту работу немного лучше?

{% if settings.products_per_row == "4" %} 
{% assign number_of_related_products_to_show = 4 %} 
{% elsif settings.products_per_row == "3" %} 
{% assign number_of_related_products_to_show = 3 %} 
{% else %} 
{% assign number_of_related_products_to_show = 2 %} 
{% endif %} 

{% assign number_of_related_products_to_fetch = number_of_related_products_to_show | plus: 1 %} 
{% assign current_product_tags = product.tags %} 

{% for c in collections %} 
    {% if c.handle == 'all' %} 
     {% assign collection_all = c %} 
    {% endif %} 
{% endfor %} 

{% assign found_first_match = false %} 
{% assign found_second_match = false %} 
{% paginate collection_all.products by 1000 %} 
{% for product in collection_all.products %} 
{% for tag in product.tags %} 
    {% if current_product_tags contains tag and found_first_match == false and tag != 'Made in USA' %} 
     {% assign found_first_match = true %} 
     {% assign first_match = tag %} 
    {% endif %} 
    {% if current_product_tags contains tag and found_first_match == true and tag != first_match and tag != 'Made in USA' %} 
     {% assign found_second_match = true %} 
     {% assign second_match = tag %} 
    {% endif %} 
{% endfor %} 
{% endfor %} 
{% endpaginate %} 

{% assign matches_found = false %} 
{% assign current_product = product %} 
{% assign current_product_found = false %} 

{% paginate collection_all.products by 1000 %} 
{% for product in collection_all.products %} 
    {% if product.handle == current_product.handle %} 
    {% assign current_product_found = true %} 
    {% else %} 
    {% if product.tags contains first_match %} 
     {% unless current_product_found == false and forloop.last %} 
     {% assign matches_found = true %} 
     {% endunless %} 
    {% endif %} 
    {% if product.tags contains second_match and matches_found == false %} 
     {% unless current_product_found == false and forloop.last %} 
     {% assign matches_found = true %} 
     {% endunless %} 
    {% endif %} 
    {% endif %} 
{% endfor %} 
{% endpaginate %} 

{% if matches_found == true %} 

<div class="row"> 
    <div class="span12"> 
    <h3 class="collection-title">Related products</h3> 
    </div> 
</div> 

<div class="row products"> 

{% paginate collection_all.products by 1000 %} 
{% for product in collection_all.products %} 
    {% if product.handle == current_product.handle %} 
    {% assign current_product_found = true %} 
    {% else %} 
    {% if product.tags contains first_match %} 
     {% unless current_product_found == false and forloop.last %} 
     {% include 'related-product-loop' with collection.handle %} 
     {% assign matched_product = product.title %} 
     {% endunless %} 
    {% endif %} 
    {% if product.tags contains second_match %} 
     {% unless current_product_found == false and forloop.last or matched_product == product.title %} 
     {% include 'related-product-loop' with collection.handle %} 
     {% endunless %} 
    {% endif %} 
    {% endif %} 
{% endfor %} 
{% endpaginate %} 

</div> 

{% endif %} 

{{ 'jquery.pick.js' | asset_url | script_tag }} 
<script type="text/javascript" charset="utf-8"> 
//<![CDATA[ 
var howMany = {{ number_of_related_products_to_show }}; 
jQuery(function() { 
    jQuery('.products .product').pick(howMany); 
}); 
//]]> 
</script> 

Я использую jquery.pick.js для случайного отображения четырех продуктов.

Мысли?

Answer 1

Я бы предложил взглянуть на эту статью на вики-странице Shopify: Related Products.

Возможно, подход, используемый в разделе 3. Finding a relevant collection, станет более чистым способом реализации связанных продуктов. Однако, если вам нужно использовать теги продукта, есть объяснение, как это сделать в разделе 4. Using product tags.

EDIT: Возможно, ваш код может быть упрощен до такого, как этот. Он очень похож на то, что у вас выше, но просто сводит его до одного цикла через все продукты, а не три.

{% if settings.products_per_row == "3" or settings.products_per_row == "4" %} 
    {% assign number_of_related_products_to_show = settings.products_per_row | times: 1 %} 
{% else %} 
    {% assign number_of_related_products_to_show = 2 %} 
{% endif %} 

{% assign current_product = product %} 
{% assign current_product_tags = product.tags %} 
{% assign found_first_match = false %} 
{% assign found_second_match = false %} 
{% assign first_related_product = true %} 

{% paginate collections.all.products by 1000 %} 
{% for product in collections.all.products %} 
    {% unless product.handle == current_product.handle %} 
    {% for tag in product.tags %} 
     {% if current_product_tags contains tag and tag != 'Made in USA' %} 
     {% if found_first_match == false %} 
      {% assign found_first_match = true %} 
      {% assign first_match = tag %} 
     {% elsif found_second_match == false %} 
      {% assign found_second_match = true %} 
      {% assign second_match = tag %} 
     {% endif %} 
     {% endif %} 
    {% endfor %} 

    {% if found_first_match == true %} 
     {% if first_related_product == true %} 
     {% assign first_related_product == false %} 

     <div class="row"> 
      <div class="span12"> 
      <h3 class="collection-title">Related products</h3> 
      </div> 
     </div> 
     <div class="row products"> 

     {% endif %} 
     {% if product.tags contains first_match or product.tags contains second_match %} 
     {% include 'related-product-loop' with collection.handle %} 
     {% endif %} 
    {% endif %} 
    {% endunless %} 
{% endfor %} 
{% if first_related_product == false %} </div> {% endif %} 
{% endpaginate %} 

{{ 'jquery.pick.js' | asset_url | script_tag }} 
<script type="text/javascript" charset="utf-8"> 
//<![CDATA[ 
    var howMany = {{ number_of_related_products_to_show }}; 
    jQuery(function() { 
    jQuery('.products .product').pick(howMany); 
    }); 
//]]> 
</script> 

Этот код находится в переводе here. Я включил 2 файла, второй вариант использует 2 цикла через продукты, но, возможно, немного читаем. (Я не мог решить между ними, поэтому я включил оба.)