Shopify mailchimp 集成

Question

在我开始之前，我发现了这个：Create a basic MailChimp signup form using their API 这似乎可以满足我的要求，但需要注意的是：

我的表格在 Shopify 上。这是一个应用程序，可让客户在产品有货时收到通知。我想要一个复选框，让他们也可以订阅我们的时事通讯。所以最终结果是它仍然会发布到应用程序，但会将它们添加到我们的时事通讯数据库中。

上述解决方案可以远程完成吗？即我将 PHP 文件放在我的主网站上，并让 ajax 指向 url？有没有更简单的方法来做到这一点？

<script type="text/javascript">
$(document).ready(function() {
      var create_callback = function(data) {
        if (data.status == 'OK') {
        $.fancybox({
            'href': '#inline_message'
            });                                
          //alert(data.message);
        } else {
          //alert("Oops! An error occurred. Please check the email address you entered and try again.");
        $.fancybox({
            'href': '#inline_message'
        });                               
          $("#inline_message").html('<h3>Oops! Looks like an error occurred.</h3> <p>Please check the email address you entered and try again.</p>');
        }
      }
      $('#notify_button').click(function(event) {
        event.preventDefault();
        BISPopover.create($('#notify_email').val(), $('#product-select :selected').val()).then(create_callback);
      });
    $('#BIS_form_submit').submit(function() {
        var isChecked = $('#chkSelect').is(':checked');
        if(isChecked){
            $.ajax({
                url: 'http://www.myURL.com/inc/store-address.php', // proper url to your "store-address.php" file
                data: $('#BIS_form_submit').serialize(),
                success: function(msg) {
                    $('#message').html(msg);
                }
            });
            return false;
        }
    });                       
});      
</script>

 <div id="BIS_form">
    <form id="BIS_form_submit">
    <input type="hidden" name="ajax" value="true" />
    <h3 id="notify-title">Notify me when this is back in stock:</h3>
    <input type="email" id="notify_email" value="Email address" onfocus="value=''"/>
    <button id="notify_button" class="first">Submit</button>
    <input type="checkbox" id="chkSelect" /><span style="font-size:10px;position:relative;top:3px;left:3px;">Add me to the Newsletter</span>
    </form>
</div> 

Answer 1

我认为您无法远程使用 MailChimp API：即从客户端的浏览器。 -- 见jQuery Ajax POST not working with MailChimp

我认为#notify_button 的单击事件处理程序需要将数据 AJAX 到服务器上的处理程序。它将与 MailChimp API 交互以将客户的电子邮件地址添加到时事通讯中。

Answer 2

我希望回答我自己的问题不是坏事，但我有它的工作。我知道这是一个边缘案例，但也许有人会觉得它有帮助。

代码：

<script type="text/javascript">
    $(document).ready(function() {
        var create_callback = function(data) {
            if (data.status == 'OK') {
                $.fancybox({'href': '#inline_message'});                                
            } else {
                $.fancybox({'href': '#inline_message'});                               
                $("#inline_message").html('<h3>Oops! Looks like an error occurred.</h3> <p>Please check the email address you entered and try again.</p>');
            }                       
        }

        $('#notify_button').click(function(event) {
        event.preventDefault();
        BISPopover.create($('#mce-EMAIL').val(), $('#product-select :selected').val()).then(function(data) {
            var BISData = data; // keep a reference to the response from the app
            var isChecked = $('#chkSelect').is(':checked');
                if(isChecked) {
                    url = 'http://YourListURL';
                    EMAIL = $("#mc_form input[name=EMAIL]").val();
                    $.ajax({
                      type: "POST",
                      url: url,
                      data: {EMAIL : EMAIL},
                      dataType: 'json',
                      complete: function(){
                        create_callback(BISData);
            if (BISData.status == 'OK') {
                $.fancybox({'href': '#inline_message'});                                
            } else {
                $.fancybox({'href': '#inline_message'});                               
                $("#inline_message").html('<h3>Oops! Looks like an error occurred.</h3> <p>Please check the email address you entered and try again.</p>');
            }                                       
                      }
                    });                                 
                }
                else {
                    create_callback(BISData);
                }
        });
        });

    });                 
</script>                   
<div id="BIS_form">
    <form id="mc_form">
    <h3 id="notify-title">Notify me when this is back in stock:</h3>
    <input type="email" id="mce-EMAIL" name="EMAIL" value="Email address" onfocus="value=''"/>
    <button id="notify_button" class="first">Submit</button>
     <input type="checkbox" id="chkSelect" /><span>Add me to the Newsletter</span>
    </form>
</div>

它会在控制台中引发错误，但它仍然有效。这可能是由于来源位于不同的服务器上。我愿意接受有关如何改进这一点的建议。您可以在此处看到它的功能（您可能需要四处寻找缺货的变体）：

http://store.manitobah.ca/collections/mukluks/