【问题标题】:Is there a way to have multiple Block types in a Shopify section?有没有办法在 Shopify 部分中有多个块类型?
【发布时间】:2020-07-20 14:08:35
【问题描述】:

在 Shopify 部分中,我有一个图像选择器块来制作图库,在同一部分中,我有一个 url 块来制作任意数量的按钮。

问题是两种块类型都出现在主题编辑器的同一个“内容”区域中。这让编辑器看起来很混乱。

有没有办法拥有 2 个单独的块区域,一个用于图片库,另一个用于按钮?

"blocks": [
  {
    "type": "button",
    "name": "Button",
    "settings": [
      {
        "type": "url",
        "id": "button_link",
        "label": "Button link"
      }
    ]
  },
  {
    "type": "image",
    "name": "Image slide",
    "settings": [
      {
        "type": "image_picker",
        "id": "image",
        "label": "Image"
      }
    ]
  }
]

【问题讨论】:

  • 抱歉,不清楚您要达到的目标。添加一些屏幕,说明您希望它的外观如何?
  • @Vladimir 添加图片例如
  • 在下面查看我的答案。无法在同一部分中拆分它们并按类型分组,但您可以将按钮和图像拆分为 2 个部分,并将两者都包含在模板中。我希望这会有所帮助。

标签: shopify liquid


【解决方案1】:

不,目前没有办法告诉 Shopify 以这种方式显示块。无论每个块的“类型”是什么,所有块都可以按任何顺序排列。管理商店的人需要手动将块排列成合理的顺序。

如果您想在项目的渲染期间更轻松地拆分块类型,您可以使用以下内容:

{% assign image_blocks = section.blocks | where: 'type', 'image' %}
{% for block in image_blocks %}
  <!-- Stuff -->
{% endfor %}

{% assign button_blocks = section.blocks | where: 'type', 'button' %}
{% for block in button_blocks %}
  <!-- Stuff -->
{% endfor %}

【讨论】:

    【解决方案2】:

    创建 2 个不同的部分并包括两者。例如:

    {% section 'buttons' %}
    
    {% section 'images' %}
    

    地点:

    sections/buttons.liquid

    {% schema %}
      {
        "name": "Buttons",
        "class": "buttons-section",
        "blocks": [
          {
            "type": "button",
            "name": "Button",
            "settings": [
              {
                "type": "URL",
                "id": "button_link",
                "label": "Button link"
              }
            ]
          }
        ]
      }
    {% endschema %}
    

    sections/images.liquid

    {% schema %}
      {
        "name": "Images",
        "class": "images-section",
        "blocks": [
          {
            "type": "image",
            "name": "Image slide",
            "settings": [
              {
                "type": "image_picker",
                "id": "image",
                "label": "Image"
              }
            ]
          }
        ]
      }
    {% endschema %}
    

    所以你会得到这个:

    【讨论】:

    • 不幸的是,出于布局原因,我需要将它们放在同一部分。我希望“富”文本字段允许链接类。
    • 布局原因是什么意思?您仍然可以在同一布局/页面上拥有这两个部分。它只是拆分管理面板主题设置中的部分,您根据添加到问题中的屏幕截图所要求的内容,即您想将它们拆分在那里,我错过了什么吗?
    • 我的意思是它需要以一种要求两个元素都在一个部分中的方式进行样式设置。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-12-04
    • 1970-01-01
    • 2020-02-01
    • 2021-04-27
    相关资源
    最近更新 更多