如何使自定义窗口小部件可用于Page Builder

时间:2020-10-20 11:52:57

标签: themes bigcommerce

我在这里https://developer.bigcommerce.com/api-docs/storefront/widgets/widgets-tutorialHow to make a BigCommerce widget compatible with PageBuilder遵循该教程,并创建了Header Images自定义窗口小部件。但是问题是,无法显示图像。我不知道我在哪里做错了,非常感谢大家的帮助。

小部件用户界面/模板enter image description here

 {
  "name": "Explore item",
  "template": "{{#each images}}<a href='{{image_url}}'><img src={{image_source}} style='width:33.3%'/></a>{{/each}}",
  "schema": [
    {
      "type": "array",
      "label": "Explore",
      "id": "images",    
      "defaultCount": 3,
      "entryLabel": "Product",
      "thumbnail": "imageUrl",       
      "schema": [
        {
          "type": "tab",
          "label": "Content",
          "sections": [
            {
              "label": "Display",
              "settings": [
                {
                  "type": "imageManager",
                  "id": "imageUrl",
                  "default": {
                    "imageUrl": "https://images.unsplash.com/photo-1548768041",
                    "type": "IMAGE_MANAGER"
                  }
                },
                {
                  "type": "select",
                  "label": "Image fit",
                  "id": "productImageFit",
                  "default": "fit",
                  "typeMeta": {
                    "selectOptions": [
                      {
                        "label": "Fill to box",
                        "value": "fill"
                      },
                      {
                        "label": "Fit to box",
                        "value": "fit"
                      }
                    ]
                  }
                },
                {
                  "type": "alignment",
                  "label": "Image alignment",
                  "id": "productImageAlignment",
                  "default": {
                    "horizontal": "center",
                    "vertical": "middle"
                  },
                  "typeMeta": {
                    "display": "both"
                  }
                }
              ]
            }
          ]
        }
      ]
    }
  ]
}

Widget :

   {
  "name": "Explore item",
  "widget_configuration": {
    "images": [
      {
        "image_url": "https://{your-store-url}/all/kinfolk-issue-16/",
        "image_source": "https://cdn11.bigcommerce.com/s-n0i50vy/images/stencil/1280x1280/products/91/309/thekinfolktablecover_1024x1024__80715.1456436719.jpg?c=2&imbypass=on"
      },
      {
        "image_url": "https://your-store-url/all/kinfolk-issue-16/",
        "image_source": "https://cdn11.bigcommerce.com/s-n0i50vy/images/stencil/1280x1280/products/109/361/kinfolkessentialissue_1024x1024__22507.1456436715.jpg?c=2&imbypass=on"
      },
      {
        "image_url": "https://your-store-url/all/kinfolk-issue-16/",
        "image_source": "https://cdn11.bigcommerce.com/s-n0i50vy/images/stencil/500x659/products/85/282/livingwithplants_grande__26452.1456436666.jpg?c=2&imbypass=on"
      }
    ]
  },
  "widget_template_uuid": "78c561a5-afe1-4216-b7be-25fc9b67876a"
}

0 个答案:

没有答案
相关问题