shopify商品详情页动态组件

在开发Shopify时，主页可以添加任意的section，但在商品详情等页面是无法添加section的，除非在page模版中引入section。特别要注意的是引入的section不能是其他页面使用过的section，不然会导致在本页加入的section会同步的更新到其他页面的section。 最近需要定制开发shopify商品详情页，Google了半天找到了一个方案，这这里记录一下。 动态section的原理就是将多个snippets引入到一个section里面，代码结构如下： 然后在section里面配置schema，通过用户输入的block来动态展示snippets，代码如下：

{% for block in section.blocks %}
  <div class="multi-container">
    {% case block.type %}
    {% when 'first-section' %}
    {% include 'snippet_first-section' %}
    {% when 'second-section' %}
    {% include 'snippet_second-section' %}
    {% endcase %}
  </div>
{% endfor %}

最后渲染结果是：

文笔有限，希望可以帮助你们！