您可以将元字段/元数据与shopify buybutton.js一起使用吗？

我寻找这个答案已经有一段时间了，但找不到任何答案。有人知道Shopify Buy Buy Button产品中是否可以包含元字段或元数据吗

一些背景-我们有一个Shopify网站，安装了Shopify应用程序“产品评论”，并在网站上大量使用。有一个辅助站点（WordPress），我们使用Shopify Buy按钮代码添加特定于该站点的一些产品（Shopify商店中的几个集合）。我们希望将产品评论添加到我们在“购买”按钮上设置的产品的模式弹出窗口中。评审数据存储在

product.metafields.spr.reviews

中

我们在buy按钮嵌入代码中添加了自定义模板和类，以自定义外观样式，但就我个人而言，我无法确定是否可以获取产品的元数据。我非常熟悉WordPress，因此我创建了一种自动方式，将产品和集合添加到我们想要的页面中，并且当页面有产品或集合要显示时，会添加buy按钮代码。因此，定制代码不是问题

我可以使用API来提取产品元数据，然后将其插入弹出窗口，但这似乎需要很多额外的工作，如果有更好的解决方案，我不想走这条路

有没有办法使用

ui.createComponent

？如果是这样的话，你会如何将其添加到代码中

以下是一些代码供参考（它是通过php输出的，因此其中有一些php变量）：

ui.createComponent（'collection'{
id:，//集合id
节点：document.getElementById（'collection component-'），//集合唯一哈希
moneyFormat:“%24%7B%7B金额%7D%7D”，
选项：{
“产品”：{
“iframe”：false，
“按钮目标”：“模态”，
“variantId”：“全部”，
“内容”：{
“imgWithCarousel”：错误，
“Variantittle”：假，
“选项”：错误，
“描述”：错误，
“带数量的按钮”：false，
“数量”：假
},
“事件”：{
“OpenModel”：函数（产品）{/*仅调试*/}，
},
“文本”：{
“按钮”：“查看产品信息”，
},
},
“购物车”：{
“内容”：{“按钮”：true}，
“风格”：{
“按钮”：{
“背景色”：“#761b79”，
“字体系列”：“Droid无衬线，无衬线”，
“：悬停：{“背景色”：“#6a186d”}，
“：焦点：{“背景色”：“#6a186d”}，
“字体大小”：“正常”
},
“页脚”：{“背景色”：“#ffffff”}
},
“谷歌字体”：[“Droid Sans”]
},
“modalProduct”：{
“iframe”：false，
“布局”：“水平”，
“内容”：{
“img”：错误，
“imgWithCarousel”：没错，
“Variantittle”：没错，
“带数量的按钮”：true，
“按钮”：错误，
“数量”：假，
“评论”：正确
},
“DOMEvents”：{
'click.product reviews'：函数（evt，目标）{/*仅调试代码*/}
},
“模板”：{
“标题”：“{data.title}}”，
“审查”：“[审查数据在此显示]”
},
“类别”：{
“评论”：“产品评论”
},
“命令”：[
“imgWithCarousel”，
“头衔”，
“价格”，
“带数量的按钮”，
“评论”，
“说明”
],
“风格”：{
“按钮”：{
“背景色”：“#761b79”，
“字体系列”：“Droid无衬线，无衬线”，
“：悬停：{“背景色”：“#6a186d”}，
“：焦点：{“背景色”：“#6a186d”}，
“字体大小”：“正常”
},
“审查”：{
“颜色”：“444”
}
},
},
“切换”：{
“风格”：{
“切换”：{
“字体系列”：“Droid无衬线，无衬线”，
“背景色”：“#761b79”，
“：悬停：{“背景色”：“#6a186d”}，
“：焦点：{“背景色”：“#6a186d”}，
“字体大小”：“正常”
}
},
“谷歌字体”：[“Droid Sans”]
},
“产品集”：{“iframe”：false，}
}
});

抱歉，无法通过BuyButton.js或JavaScript Buy SDK访问元字段。有关更多信息，请参阅此帖子：

谢谢Josh。这就是我想要的，一个明确的答案。看起来他们将来可能会增加支持。目前，我必须使用API进行调用，并以这种方式添加它。

ui.createComponent( 'collection', {
id: <?php echo $idkey; ?>, // collection id
node: document.getElementById( 'collection-component-<?php echo $idval['hash'];?>' ), //collection unique hash
moneyFormat: '%24%7B%7Bamount%7D%7D',
options: { 
      "product": {
        "iframe": false,
        "buttonDestination": "modal",
        "variantId": "all",
        "contents": {
          "imgWithCarousel": false,
          "variantTitle": false,
          "options": false,
          "description": false,
          "buttonWithQuantity": false,
          "quantity": false
        },
        "events":{
         "openModal": function (product) { /* debug only */ },
        },
        "text": {
          "button": "VIEW PRODUCT INFO",
        },
      },
      "cart": {
        "contents": {"button": true},
        "styles": {
          "button": {
            "background-color": "#761b79",
            "font-family": "Droid Sans, sans-serif",
            ":hover": {"background-color": "#6a186d"},
            ":focus": {"background-color": "#6a186d"},
            "font-weight": "normal"
          },
          "footer": {"background-color": "#ffffff"}
        },
        "googleFonts": ["Droid Sans"]
      },
      "modalProduct": {
        "iframe": false,
        "layout": "horizontal",
        "contents": {
          "img": false,
          "imgWithCarousel": true,
          "variantTitle": true,
          "buttonWithQuantity": true,
          "button": false,
          "quantity": false,
          "reviews": true
        },
        "DOMEvents": {
          'click .product-reviews': function (evt, target) { /* debug code only */}
        },
        "templates": {
            "title" : '<h1 class="{{data.classes.modalProduct.title}}" data-element="product.title">{{data.title}}</h1>',
            "reviews": '<div class="{{data.classes.product.reviews}}">[ review data goes here ]</div>'
        },
        "classes": {
            "reviews" : "product-reviews"   
        },
        "order" :[
            "imgWithCarousel",
            "title", 
            "price", 
            "buttonWithQuantity", 
            "reviews", 
            "description"
        ],
        "styles": {
          "button": {
            "background-color": "#761b79",
            "font-family": "Droid Sans, sans-serif",
            ":hover": {"background-color": "#6a186d"},
            ":focus": {"background-color": "#6a186d"},
            "font-weight": "normal"
          },
          "reviews" : {
            "color" : "#444"
          }
        },
      },
      "toggle": {
        "styles": {
          "toggle": {
            "font-family": "Droid Sans, sans-serif",
            "background-color": "#761b79",
            ":hover": {"background-color": "#6a186d"},
            ":focus": {"background-color": "#6a186d"},
            "font-weight": "normal"
          }
        },
      "googleFonts": ["Droid Sans"]
      },
      "productSet": {"iframe": false,}
    }
});