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

我希望能夠回答我自己的問題並不是壞的形式，但我有它的工作。我知道這是一個邊緣案例，但也許有人會發現它有幫助。

代碼：

<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/

Answer 2

我不認爲你將能夠遠程使用MailChimp API：即從客戶端的瀏覽器。 - 請參閱jQuery Ajax POST not working with MailChimp

我認爲您的單擊事件處理程序#notify_button需要將AJAX數據發送到服務器上的處理程序。這個處理程序將與MailChimp API進行交互，以將客戶的電子郵件地址添加到通訊中。