【发布时间】：2017-06-18 17:48:56
【问题描述】：
我一直在寻找这个答案一段时间，但找不到任何东西。有谁知道元字段或元数据是否可以包含在 Shopify Buy Button 产品中？
一些背景 - 我们有一个 Shopify 网站，该网站安装了 Shopify 应用程序“产品评论”并在该网站上大量使用。有一个辅助站点 (WordPress)，我们在其中使用 Shopify Buy Button 代码添加一些特定于该站点的产品（Shopify 商店的几个集合）。我们希望将产品评论添加到我们在购买按钮上设置的产品的模式弹出窗口中。评论数据存储在product.metafields.spr.reviews。
我们在购买按钮嵌入代码中添加了自定义模板和类，以自定义样式外观，但对于我来说，我无法确定是否可以获取产品的元数据。我对 WordPress 非常熟悉，因此我创建了一种自动方式来将产品和集合添加到我们想要它们的页面，并且当页面有要显示的产品或集合时添加购买按钮代码。因此，自定义代码不是问题。
我可以使用 API 来提取产品元数据，然后将其插入到弹出窗口中，但这似乎需要做很多额外的工作，如果有更好的解决方案，我不想走这条路。
有没有办法使用ui.createComponent 做到这一点？如果是这样，您将如何将其添加到代码中？
这里是一些代码供参考（它是通过php输出的，所以里面有一些php变量）：
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,}
}
});
【问题讨论】：
标签： shopify