我已经建立了一个液体模板,用于比较当前产品的标签和商店中所有其他产品的标签,并在页面底部显示四个相关产品。
它有效,但我认为我做得非常低效。有没有办法让这项工作更好一点?
{% 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随机显示四种产品。
思想?
答案 0 :(得分:1)
我建议您在Shopify wiki上查看这篇文章:Related Products。
第3. Finding a relevant collection节中使用的方法可能是实现相关产品的更简洁方法。但是,如果您需要使用产品标签,则可以在4. Using product tags部分中解释如何执行此操作。
编辑:也许您的代码可以简化为类似的东西。它与上面的内容非常相似,但只是通过所有产品将其减少到一个循环,而不是三个。
{% 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个循环,但可能更具可读性。 (我无法在两者之间作出决定,因此我将两者都包括在内。)