Shopify自定义关联产品模块部分标签无法返回相似产品问题排查

• 自定义Liquid模块功能：根据当前产品的标签，返回全站中前4个同标签的关联产品（排除自身）
• 异常情况：绝大多数产品的标签能正常触发关联，但部分标签（如Walkers）完全无法返回关联产品
• 环境说明：全站不含变体共108个产品，模块顶部已能正常显示当前产品的标签
• 示例场景：
  • 正常生效：带PowerChairs标签的产品页面
  • 失效场景：带Walkers标签的walk_002产品页面

{% assign product = product %}
{% assign current_tags = product.tags %}
{% assign all_products = collections.all.products %}

<div  class="container custom-related-product">
  <section>
    <div>
      {% if section.settings.product_recommendations_heading != blank %}
        <div class="twelve{% unless settings.borders_enable %} bottompad{% endunless %}">
          <h2 class="text-center">{{ section.settings.product_recommendations_heading }}</h2>
        
{% echo current_tags %}
        
        </div>
      {% endif %}
{% assign related_products = 0 %}
      <div class="product-loop center">
          
        {% for similar_product in all_products %}
          {% if similar_product.handle != product.handle %}
            {% for current_product_tag in product.tags %}
              {% if similar_product.tags contains current_product_tag %}
                {%  render 'product.loop', product: similar_product, block_width: 'three' %}
{% assign related_products = related_products | plus: 1 %}
                {% break %}
              {% endif %}
            {% endfor %}
{% if related_products == 4 %}
{% break %}
{% endif %}
          {% endif %}
        {% endfor %}

      </div>
    </div>
  </section>
</div>

核心问题 #

1. 标签大小写敏感：Shopify的contains判断是严格大小写匹配的，如果Walkers标签在部分产品中是小写（如walkers）、带空格或特殊字符，就会匹配失败
2. 产品数量限制：collections.all.products默认仅返回前50个产品，全站108个产品中，Walkers相关产品可能落在50条之后，导致无法被遍历到
3. 重复产品风险：原逻辑未去重，若一个产品匹配多个标签，可能被多次添加（虽然后续break避免了，但逻辑不严谨）

修复后的代码 #

{% assign product = product %}
{% assign current_tags_lower = product.tags | map: 'downcase' %}
{% assign all_products = collections.all.products | limit: 200 %}
{% assign displayed_handles = '' %}
{% assign related_products = 0 %}

<div class="container custom-related-product">
  <section>
    <div>
      {% if section.settings.product_recommendations_heading != blank %}
        <div class="twelve{% unless settings.borders_enable %} bottompad{% endunless %}">
          <h2 class="text-center">{{ section.settings.product_recommendations_heading }}</h2>
          {{ current_tags | join: ', ' }}
        </div>
      {% endif %}
      
      <div class="product-loop center">
        {% for similar_product in all_products %}
          {% if similar_product.handle != product.handle and related_products < 4 %}
            {% assign similar_tags_lower = similar_product.tags | map: 'downcase' %}
            {% assign has_match = false %}
            
            {% for tag in current_tags_lower %}
              {% if similar_tags_lower contains tag %}
                {% assign has_match = true %}
                {% break %}
              {% endif %}
            {% endfor %}
            
            {% if has_match and displayed_handles contains similar_product.handle == false %}
              {% render 'product.loop', product: similar_product, block_width: 'three' %}
              {% assign related_products = related_products | plus: 1 %}
              {% assign displayed_handles = displayed_handles | append: similar_product.handle | append: ',' %}
            {% endif %}
          {% endif %}
        {% endfor %}
      </div>
    </div>
  </section>
</div>

修复说明 #

• 把所有标签转成小写后再匹配，彻底解决大小写敏感问题
• 用limit:200确保能获取全站所有108个产品
• 添加displayed_handles记录已显示的产品handle，避免重复渲染
• 优化循环逻辑，提前判断related_products <4减少不必要的遍历

内容的提问来源于stack exchange，提问作者Alen Giliana