Skip to content

Instantly share code, notes, and snippets.

@tessalt
Last active January 11, 2017 19:09
Show Gist options
  • Save tessalt/d546fc64de0da54d42f2a9274da11824 to your computer and use it in GitHub Desktop.
Save tessalt/d546fc64de0da54d42f2a9274da11824 to your computer and use it in GitHub Desktop.

Revisions

  1. tessalt revised this gist Jan 11, 2017. 1 changed file with 19 additions and 0 deletions.
    19 changes: 19 additions & 0 deletions index.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,19 @@
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>BuyButton.js</title>
    </head>
    <body>
    <div id="contents"></div>
    <script src="https://code.jquery.com/jquery-3.1.1.js"></script>
    <script type="text/javascript">
    $.ajax({
    url: '/ajax.html'
    }).then(function (data) {
    $('#contents').append(data);
    });
    </script>
    </body>
    </html>
  2. tessalt created this gist Jan 11, 2017.
    38 changes: 38 additions & 0 deletions ajax.html
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,38 @@
    <!DOCTYPE html>
    <html>
    <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Test: Product</title>
    </head>
    <body>
    <script data-shopify-buy-ui>
    (function () {
    var scriptURL = "../../tmp/buy-button-storefront.js";
    if (window.ShopifyBuy && window.ShopifyBuy.UI) {
    ShopifyBuyInit();
    } else {
    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({
    // your credentials here
    });

    ShopifyBuy.UI.onReady(client).then(function (ui) {
    ui.createComponent('product', {
    // your config here
    });
    });
    }
    })();
    </script>
    </body>
    </html>