如何解决如何使用 Shopify 中的架构集合从一个部分输出集合的产品?
我正在尝试从架构中显示选定的集合(该用户可以从 Shopify 管理面板中进行选择)并将其循环显示在滑块中。 请让我知道如何像我显示的内容一样在前端显示它。
这是我的架构代码: {% 评论 %} ** 单一精选集 - 主页部分 ** - 可拖动部分 {% endcomment %}
{% include 'include-collection-slider' %}
{% schema %}
{
"name" : "collection_tab","class": "featured-collection-section","settings" :[
{
"type": "text","id": "title","label": "Header Name","default": "SHOP BY NEED"
},{
"type": "collection","id": "collection1","label": "Collection 1"
},"id": "collection2","label": "Collection 2"
},{
"type": "radio","id": "collection_style","label": "Collection layout","default": "grid","options": [
{
"value": "slider","label": "Slider"
},{
"value": "grid","label": "Grid"
}
]
},{
"type": "header","content": "Products"
},{
"type": "range","id": "products_per","label": "Products per row","min": 2,"max": 7,"step": 1,"default": 3
},"id": "products_limit","label": "Limit products","max": 50,"default": 9
}
],"blocks" : [
{
"type": "text","name": "Category Tab Name","settings" :[
{
"type": "text","id": "tab","label": "Tab Name"
},{
"type": "text","id": "heading","label": "Heading"
},{
"type": "checkbox","id": "collection_description","label": "Show Description"
},{
"type": "richtext","id": "collection_content","label": "Show Content"
},{
"type": "collection","id": "collection","label": "Collection"
},{
"type": "radio","options": [
{
"value": "slider","label": "Slider"
},{
"value": "grid","label": "Grid"
}
]
},{
"type": "range","default": 3
},{
"type": "range","default": 9
}
]
}
],"presets": [{
"name": "Collection Slider","category": "Collection","settings": {
}
}]
}
{% endschema %}
****Here is my Liquid Code:****
{% if type == 'block' %}
{% assign title = block.settings.title %}
{% assign settingHeading = block.settings.heading %}
{% assign settingCollection = block.settings.collection %}
{% assign collection_style = block.settings.collection_style %}
{% assign collection_description = block.settings.collection_description %}
{% assign products_per = block.settings.products_per %}
{% assign products_limit = block.settings.products_limit %}
{% else %}
{% assign title = section.settings.title %}
{% assign settingCollection = section.settings.collection %}
{% assign collection_style = section.settings.collection_style %}
{% assign collection_description = section.settings.collection_description %}
{% assign products_per = section.settings.products_per %}
{% assign products_limit = section.settings.products_limit %}
{% endif %}
{% assign limit = products_limit %}
{% if collection_style == 'slider' %}
{% assign col = settingCollection | handleize %}
{% assign products = collections[col].products %}
{% assign product_count = collections[col].all_products_count %}
{% assign per_slide = products_per %}
{% endif %}
{% if settingCollection == blank %}
{%- assign section_onboarding = true -%}
{% comment %}assign product length to be selected limit for onboarding{% endcomment %}
{% assign products_length = products_limit | plus: 0 %}
{% else %}
{%- assign section_onboarding = false -%}
{% endif %}
<div class="container featured_products product-{{ collection_style }}">
<div class="sixteen columns center homepage_content">
<h2 class="title">{{ title }}</h2>
</div>
<div class="tabs">
<!--Collection Tabs Code Start -->
<ul class="tabs-thumbs">
{%for block in section.blocks %}
<li class="tabs-thumb">
<a>{{block.settings.tab}}</a>
</li>
{%endfor%}
</ul>
<!--Collection Tabs Code End -->
<ul class="tabs-panels">
{% for block in section.blocks%}
<li class="tabs-panel">
<div class="sixteen row collection-slider">
<div class="six columns center homepage_content">
<div class="section clearfix featured-collection__description">
<div style="display:inline-flex;margin-bottom: 15px; font-weight: 900; color: red;">
Collection Name:{{block.settings.collection | products}}<br>
{{popular_product}}
</div>
{{block.settings.collection_content}}
</div>
</div>
<div class="ten columns js-product-slider homepage-product-slider full-width--true featured-collection__products">
<div class="container js-product-slider homepage-product-slider full-width--true
{% if per_slide == 2 or per_slide == 4 or per_slide == 6 %}
even-num-slides{% endif %} featured-collection__products">
{% if section_onboarding == false %}
{% if product_count > 0 %}
{% render 'product-slider',limit: limit,products: products,per_slide: products_per,featured_collection: col
%}
{% endif %}
{% endif %}
</div>
</div>
</div>
</li>
{%endfor%}
</ul>
</div>
<div>
</div>
</div>
解决方法
A "type": "collection" 将返回集合句柄,然后您需要执行以下操作:
{% for item in collections[section.settings.collection2].products %}
<div class="slider-item">
{{ item.title }}
{{ item.price | money }}
{{ item.featured_image | img_url: '250x' }}
{{ item.url }}
</div>
{% endfor %}
将其放入滑块代码中并根据需要更改代码。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。