【发布时间】：2021-04-10 19:12:32
【问题描述】：
我正在尝试显示从架构中选择的集合（用户可以从 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"
},
{
"type": "collection",
"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
},
{
"type": "range",
"id": "products_limit",
"label": "Limit products",
"min": 2,
"max": 50,
"step": 1,
"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",
"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
},
{
"type": "range",
"id": "products_limit",
"label": "Limit products",
"min": 2,
"max": 50,
"step": 1,
"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>
【问题讨论】：
标签： javascript jquery shopify shopify-app shopify-template