如何获取shopify购买按钮所需的ID?

时间:2018-12-11 22:45:32

标签: wordpress shopify

如何获取shopify产品资源ID?在他们的博客文章here(向下滚动到本节,3。创建组件)中,他们建议看起来像这样,id: 1234567

ui.createComponent('product', {
  id: 1234567,
  node: document.getElementById('my-product')
});

如何获得此值? id: 1234567

当我点击how to find a resource IDthe article中的链接时,我被带到here,然后带我here

我试图在我的wordpress网站上用迷你购物车构建一个shopify购买按钮。 Shopify为我提供了每个产品的开箱即用生成的代码,如下所示:

<div id='product-component-a3721b1ed3e' ></div>
<script type="text/javascript">
    /*<![CDATA[*/

    (function () {
      var scriptURL = 'https://sdks.shopifycdn.com/buy-button/latest/buy-button-storefront.min.js';
      if (window.ShopifyBuy) {
        if (window.ShopifyBuy.UI) {
          ShopifyBuyInit();
        } else {
          loadScript();
        }
      } else {
        loadScript();
      }

      function loadScript() {
        var script = document.createElement('script');
        script.async = true;
        script.src = scriptURL;
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(script);
        script.onload = ShopifyBuyInit;
      }

      function ShopifyBuyInit() {
        var client = ShopifyBuy.buildClient({
          domain: 'my-shop.com',
          storefrontAccessToken: 'my-token',
        });

        ShopifyBuy.UI.onReady(client).then(function (ui) {

          ui.createComponent('product', {
            id: [12345667820298],
            node: document.getElementById('product-component-a3721b1ed3e'),
            moneyFormat: '%24%7B%7Bamount%7D%7D',
            options: {
            "product": {
              "variantId": "all",
              "width": "240px",
              "contents": {
                "img": false,
                "imgWithCarousel": false,
                "title": false,
                "variantTitle": false,
                "price": false,
                "description": false,
                "buttonWithQuantity": false,
                "quantity": false
              },
              "styles": {
                "product": {
                  "text-align": "left",
                  "@media (min-width: 601px)": {
                    "max-width": "100%",
                    "margin-left": "0",
                    "margin-bottom": "50px"
                  }
                },
                "title": {
                  "font-size": "26px"
                },
                "price": {
                  "font-size": "18px"
                },
                "compareAt": {
                  "font-size": "15px"
                }
              }
            },
            "cart": {
              "contents": {
                "button": true
              },
              "styles": {
                "footer": {
                  "background-color": "#ffffff"
                }
              }
            },
            "modalProduct": {
              "contents": {
                "img": false,
                "imgWithCarousel": true,
                "variantTitle": false,
                "buttonWithQuantity": true,
                "button": false,
                "quantity": false
              },
              "styles": {
                "product": {
                  "@media (min-width: 601px)": {
                    "max-width": "100%",
                    "margin-left": "0px",
                    "margin-bottom": "0px"
                  }
                }
              }
            },
            "productSet": {
              "styles": {
                "products": {
                  "@media (min-width: 601px)": {
                    "margin-left": "-20px"
                  }
                }
              }
            }
          }
          });
        });
      }
    })();
    /*]]>*/
</script>

这似乎是我想要的每种产品的ID:

      ui.createComponent('product', {
        id: [12345667820298],

我只是不知道如何获得它。

1 个答案:

答案 0 :(得分:0)

是的,这是ID。如果您生成购买按钮,则会获得ID。无需采取进一步措施。此ID也显示在URL中。例如,在后端转到产品-所有产品,然后单击一个产品。该URL现在以id结尾。

我认为这很令人困惑。它们的存在句柄(源自产品名称),此变体ID和API中使用的ID。