shopify 基于标签的产品推荐
Tag based Product Recommendation on shopify
我正在尝试根据与产品共有的标签显示相关产品
为此创建了一个部分并使用了这段代码
https://www.shopify.com/partners/blog/related-products
我使用了相同的标签 'test'
也替换了
{% include 'product-card-grid', max_height: max_height %}
与
{% 渲染 'product-item',产品:产品 %}
因为在声望主题中没有 product-card-grid 的片段
但产品页面上什么都没有显示,连标题都没有
enter code here
{% if section.settings.show_related_products == true %}
<hr>
<div class="product-template__container page-width" itemscope itemtype="http://schema.org/Product" id="ProductSection-{{ section.id }}" data-section-id="{{ section.id }}" data-section-type="product" data-enable-history-state="true">
{% comment %}
Number of related items per row,
and number of rows.
{% endcomment %}
{% assign number_of_related_products_per_row = section.settings.related_grid_num %}
{% assign number_of_rows = section.settings.related_grid_row %}
{% comment %}
Heading.
Leave blank if you don't need one.
{% endcomment %}
{% assign heading = section.settings.related_title %}
{% comment %}
Set either or both to true, if you want
to limit yourself to items with same vendor, and/or type.
{% endcomment %}
{% assign same_vendor = false %}
{% assign same_type = false %}
{% comment %}
Collections to ignore.
Never pick related items from those.
{% endcomment %}
{% assign exclusions = 'frontpage,all' | split: ',' %}
{% comment %}
Looking for a relevant collection.
{% endcomment %}
{% if product.metafields.c_f['Related Products'] %}
{% assign collection = collections[product.metafields.c_f['Related Products']] %}
{% endif %}
{% assign found_a_collection = false %}
{% if collection and collection.all_products_count > 1 %}
{% unless exclusions contains collection.handle %}
{% assign found_a_collection = true %}
{% endunless %}
{% endif %}
{% unless found_a_collection %}
{% for c in product.collections %}
{% unless exclusions contains c.handle or c.all_products_count < 2 %}
{% assign found_a_collection = true %}
{% assign collection = c %}
{% break %}
{% endunless %}
{% endfor %}
{% endunless %}
{% comment %}
If we have a relevant collection.
{% endcomment %}
{% if found_a_collection %}
{% assign counter = 0 %}
{% assign break_at = number_of_rows | times: number_of_related_products_per_row %}
{% assign current_product = product %}
{% case number_of_related_products_per_row %}
{% when '1' %}
{% assign grid_item_width = '' %}
{%- assign max_height = 700 -%}
{% when '2' %}
{% assign grid_item_width = 'small--one-half medium-up--one-half' %}
{%- assign max_height = 530 -%}
{% when '3' %}
{% assign grid_item_width = 'small--one-half medium-up--one-third' %}
{%- assign max_height = 345 -%}
{% when '4' %}
{% assign grid_item_width = 'small--one-half medium-up--one-quarter' %}
{%- assign max_height = 250 -%}
{% when '5' %}
{% assign grid_item_width = 'small--one-half medium-up--one-fifth' %}
{%- assign max_height = 195 -%}
{% when '6' %}
{% assign grid_item_width = 'small--one-half medium-up--one-sixth' %}
{%- assign max_height = 195 -%}
{% else %}
{% assign grid_item_width = 'small--one-half medium-up--one-quarter' %}
{%- assign max_height = 195 -%}
{% endcase %}
{% capture related_items %}
<div class="grid grid--uniform{% if collection.products_count > 0 %} grid--view-items{% endif %}">
{% for product in collections.all.products %}
{% unless product.handle == current_product.handle %}
{% unless same_vendor and current_product.vendor != product.vendor %}
{% unless same_type and current_product.type != product.type %}
{% comment %}
Replace 'test' below with prefered tag
{% endcomment %}
{% if product.tags contains 'test' %}
<div class="grid__item {{ grid_item_width }}">
{% render 'product-item', product: product %}}
</div>
{% assign counter = counter | plus: 1 %}
{% if counter == break_at %}
{% break %}
{% endif %}
{% endif %}
{% endunless %}
{% endunless %}
{% endunless %}
{% endfor %}
</div>
{% endcapture %}
{% assign related_items = related_items | trim %}
{% unless related_items == blank %}
<aside class="grid">
<div class="grid__item">
{% unless heading == blank %}
<header class="section-header">
<h3>{{ heading }}</h3>
</header>
{% endunless %}
<div class="grid-uniform">
{{ related_items }}
</div>
</div>
</aside>
{% endunless %}
{% endif %}
</div>
{% endif %}
{% schema %}
{
"name": "Related products",
"settings": [
{
"type": "checkbox",
"id": "show_related_products",
"label": "Show related products",
"default": false
},
{
"id": "related_title",
"type": "text",
"label": "Section title",
"default": "Other fine products"
},
{
"type": "select",
"id": "related_grid_num",
"label": "Products per row (Desktop)",
"default": "4",
"options": [
{
"value": "2",
"label": "2"
},
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
}
]
},
{
"type": "select",
"id": "related_grid_row",
"label": "Number of rows (Desktop)",
"default": "1",
"options": [
{
"value": "1",
"label": "1"
},
{
"value": "2",
"label": "2"
},
{
"value": "3",
"label": "3"
}
]
}
]
}
{% endschema %} ```
我认为你在 {% render 'product-item', product: product %}} 上有一个额外的'}',尝试删除它,你也可以通过这种方式测试你的变量
{{ variable | json }}
这将打印任何变量的数据。
您可以将类似这样的内容添加到您的代码中,以获得更好的样式,便于阅读。
<pre>{{ variable | json }}</pre>
也没有collection.all.products你需要用
collection.products
我正在尝试根据与产品共有的标签显示相关产品 为此创建了一个部分并使用了这段代码 https://www.shopify.com/partners/blog/related-products 我使用了相同的标签 'test' 也替换了
{% include 'product-card-grid', max_height: max_height %}
与 {% 渲染 'product-item',产品:产品 %} 因为在声望主题中没有 product-card-grid 的片段 但产品页面上什么都没有显示,连标题都没有
enter code here
{% if section.settings.show_related_products == true %}
<hr>
<div class="product-template__container page-width" itemscope itemtype="http://schema.org/Product" id="ProductSection-{{ section.id }}" data-section-id="{{ section.id }}" data-section-type="product" data-enable-history-state="true">
{% comment %}
Number of related items per row,
and number of rows.
{% endcomment %}
{% assign number_of_related_products_per_row = section.settings.related_grid_num %}
{% assign number_of_rows = section.settings.related_grid_row %}
{% comment %}
Heading.
Leave blank if you don't need one.
{% endcomment %}
{% assign heading = section.settings.related_title %}
{% comment %}
Set either or both to true, if you want
to limit yourself to items with same vendor, and/or type.
{% endcomment %}
{% assign same_vendor = false %}
{% assign same_type = false %}
{% comment %}
Collections to ignore.
Never pick related items from those.
{% endcomment %}
{% assign exclusions = 'frontpage,all' | split: ',' %}
{% comment %}
Looking for a relevant collection.
{% endcomment %}
{% if product.metafields.c_f['Related Products'] %}
{% assign collection = collections[product.metafields.c_f['Related Products']] %}
{% endif %}
{% assign found_a_collection = false %}
{% if collection and collection.all_products_count > 1 %}
{% unless exclusions contains collection.handle %}
{% assign found_a_collection = true %}
{% endunless %}
{% endif %}
{% unless found_a_collection %}
{% for c in product.collections %}
{% unless exclusions contains c.handle or c.all_products_count < 2 %}
{% assign found_a_collection = true %}
{% assign collection = c %}
{% break %}
{% endunless %}
{% endfor %}
{% endunless %}
{% comment %}
If we have a relevant collection.
{% endcomment %}
{% if found_a_collection %}
{% assign counter = 0 %}
{% assign break_at = number_of_rows | times: number_of_related_products_per_row %}
{% assign current_product = product %}
{% case number_of_related_products_per_row %}
{% when '1' %}
{% assign grid_item_width = '' %}
{%- assign max_height = 700 -%}
{% when '2' %}
{% assign grid_item_width = 'small--one-half medium-up--one-half' %}
{%- assign max_height = 530 -%}
{% when '3' %}
{% assign grid_item_width = 'small--one-half medium-up--one-third' %}
{%- assign max_height = 345 -%}
{% when '4' %}
{% assign grid_item_width = 'small--one-half medium-up--one-quarter' %}
{%- assign max_height = 250 -%}
{% when '5' %}
{% assign grid_item_width = 'small--one-half medium-up--one-fifth' %}
{%- assign max_height = 195 -%}
{% when '6' %}
{% assign grid_item_width = 'small--one-half medium-up--one-sixth' %}
{%- assign max_height = 195 -%}
{% else %}
{% assign grid_item_width = 'small--one-half medium-up--one-quarter' %}
{%- assign max_height = 195 -%}
{% endcase %}
{% capture related_items %}
<div class="grid grid--uniform{% if collection.products_count > 0 %} grid--view-items{% endif %}">
{% for product in collections.all.products %}
{% unless product.handle == current_product.handle %}
{% unless same_vendor and current_product.vendor != product.vendor %}
{% unless same_type and current_product.type != product.type %}
{% comment %}
Replace 'test' below with prefered tag
{% endcomment %}
{% if product.tags contains 'test' %}
<div class="grid__item {{ grid_item_width }}">
{% render 'product-item', product: product %}}
</div>
{% assign counter = counter | plus: 1 %}
{% if counter == break_at %}
{% break %}
{% endif %}
{% endif %}
{% endunless %}
{% endunless %}
{% endunless %}
{% endfor %}
</div>
{% endcapture %}
{% assign related_items = related_items | trim %}
{% unless related_items == blank %}
<aside class="grid">
<div class="grid__item">
{% unless heading == blank %}
<header class="section-header">
<h3>{{ heading }}</h3>
</header>
{% endunless %}
<div class="grid-uniform">
{{ related_items }}
</div>
</div>
</aside>
{% endunless %}
{% endif %}
</div>
{% endif %}
{% schema %}
{
"name": "Related products",
"settings": [
{
"type": "checkbox",
"id": "show_related_products",
"label": "Show related products",
"default": false
},
{
"id": "related_title",
"type": "text",
"label": "Section title",
"default": "Other fine products"
},
{
"type": "select",
"id": "related_grid_num",
"label": "Products per row (Desktop)",
"default": "4",
"options": [
{
"value": "2",
"label": "2"
},
{
"value": "3",
"label": "3"
},
{
"value": "4",
"label": "4"
},
{
"value": "5",
"label": "5"
}
]
},
{
"type": "select",
"id": "related_grid_row",
"label": "Number of rows (Desktop)",
"default": "1",
"options": [
{
"value": "1",
"label": "1"
},
{
"value": "2",
"label": "2"
},
{
"value": "3",
"label": "3"
}
]
}
]
}
{% endschema %} ```
我认为你在 {% render 'product-item', product: product %}} 上有一个额外的'}',尝试删除它,你也可以通过这种方式测试你的变量
{{ variable | json }}
这将打印任何变量的数据。
您可以将类似这样的内容添加到您的代码中,以获得更好的样式,便于阅读。
<pre>{{ variable | json }}</pre>
也没有collection.all.products你需要用
collection.products