Сопутствующие товары по тегу в Shopify
Я создал жидкий шаблон для сравнения тегов текущих продуктов с тегами всех других продуктов в магазине и отображения четырех связанных продуктов в нижней части страницы.
Это работает, но я думаю, что сделал это совершенно неэффективно. Есть ли способ сделать эту работу немного лучше?{% 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.выбирать.js для случайного отображения четырех продуктов.
Мысли?
1 ответ:
Я бы предложил взглянуть на эту статью в Shopify wiki: сопутствующие товары.
Возможно, подход, используемый в разделе 3. Поиск соответствующей коллекции был бы более чистым способом реализации связанных продуктов. Однако если вам нужно использовать теги продуктов, есть объяснение, как это сделать, а также в разделе 4. Использование тегов продукта .
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>
Этот код находится в gist здесь. Я включил 2 файла, второй вариант использует 2 цикла через продукты, но, возможно, немного более читабелен. (Я не мог выбрать между этими двумя, поэтому включил оба.)