Shopify Mailchimp 嵌入表单无法运行答案

【问题标题】：Shopify Mailchimp embed form fails to runShopify Mailchimp 嵌入表单无法运行
【发布时间】：2018-08-31 15:36:26
【问题描述】：

抱歉，这是我的第一篇文章，所以我可能做错了。

好的，我既不是程序员也不是 Javascript 人，但今天我重新添加了嵌入到我的替换 Shopify 主题（布鲁克林）中的 Mailchimp，因为我们曾经使用另一个付费但不满意。该表单缺乏任何真正的控制，因为它使用连接的站点直接发布到商店而无需我的干预。

无论我是否将表单设置为锚定到，我的商店都没有提示。底部，滑出或模态。所以，我决定尝试解决这个问题，我注意到在 Chrome 的 javascript 调试器中没有与脚本相关的错误。我在代码“isDebug：true”中启用了调试标志，我可以认为它正在生成一个错误，回调到 Mailchimp 上的 .js 文件。

然后我注意到菜单消失了，移动视图中也出现了汉堡包，所以我开始在谷歌上搜索更多内容，看看是什么原因造成的。

所以从一开始我就是这样做的：创建了一个名为“mailchimp-custom-popup”的资产，并将 Mailchimp 的原始代码放在那里： require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"mc.us16.list-manage.com","uuid":"32f5d817d0c08b5125bcebd73","lid ":"ddb32526fb"}) })

将 %include% 放在主体上方的 theme.liquid 中： {% include 'mailchimp-custom-popup' %}

所以这里的菜单不起作用（启用抽屉的布鲁克林部分主题）并且脚本甚至无法运行。

所以我添加了我在博客上找到的这个（jQuery.noConflict 部分）：

jQuery.noConflict ( 
<script type="text/javascript" src="//downloads.mailchimp.com/js/signup-forms/popup/embed.js" data-dojo-config="usePlainJson: true, isDebug: false"></script><script type="text/javascript">require(["mojo/signup-forms/Loader"], function(L) { L.start({"baseUrl":"mc.us16.list-manage.com","uuid":"32f5d817d0c08b5125bcebd73","lid":"ddb32526fb"}) })</script>
}

但没有区别，但后来一个错字让我发现了一些有趣的东西。我不小心从我的 sn-p 文件中删除了很多上述代码，然后菜单重新出现，并且在清除缓存后弹出窗口开始加载。这是错字后代码的样子：

jQuery.noConflict(
<script
return
)

这很奇怪，因为我不再拥有脚本，但它似乎以某种方式使事情顺利进行。这怎么可能？

在清除缓存的移动 IOS Chrome 上，它每次都能完美运行，这仍然没有意义，因为我在我的 sn-p 文件中省略了 Mailchimp 的代码。 Firefox 也可以在 Mac 上运行，我不知道为什么或如何。有人可以帮忙解释一下吗？

如果需要，我可以更好地解释，但我知道 Carolin Schnapp 会完全理解这一点。

最后一点，在注册后屏幕出现后，手机上显示我的注册折扣代码，屏幕一直保持不透明且无响应，直到我刷新页面，也不知道为什么。

对不起，这么长的故事，但任何帮助都会非常感激，因为我正在尝试使用更多的 GitHub 和其他 Shopify 代码来获得主题的真棒。谢谢！

更新发布后，我再次重新运行并检查网站上的源输出，并注意到 Mailchimp 是通过 chimpstatic 提交的，所以它解释了我奇怪的代码是如何工作的（但对我来说不是真的！）并且提到了Beeketing 我在更改主题之前使用的应用程序，所以我猜这与它的实际工作方式有关，但如果有人能解释，我将不胜感激。工作页面上源代码输出的脚本为（实际店铺名称已被替换）：

<script>(function() {
  function asyncLoad() {
    var urls = ["https:\/\/chimpstatic.com\/mcjs-connected\/js\/users\/32f5d817d0c08b5125bcebd73\/79c69f7b2f9e0f08132bc377f.js?shop=SHOPNAME.myshopify.com","https:\/\/sdk.beeketing.com\/js\/beeketing.js?shop=SHOPNAME.myshopify.com","https:\/\/sdk.beeketing.com\/js\/beeketing.js?shop=SHOPNAME.myshopify.com","\/\/productreviews.shopifycdn.com\/assets\/v4\/spr.js?shop=SHOPNAME.myshopify.com","https:\/\/cdn.shopifycloud.com\/messenger_commerce\/assets\/new_message_us?version=1521191482\u0026page_id=279040275910443\u0026color=blue\u0026size=standard\u0026position_horizontal=left\u0026position_vertical=bottom\u0026messenger_app_id=1163199097047119\u0026shop=SHOPNAME.myshopify.com"];
    for (var i = 0; i < urls.length; i++) {
      var s = document.createElement('script');
      s.type = 'text/javascript';
      s.async = true;
      s.src = urls[i];
      var x = document.getElementsByTagName('script')[0];
      x.parentNode.insertBefore(s, x);
    }
  };
  if(window.attachEvent) {
    window.attachEvent('onload', asyncLoad);
  } else {
    window.addEventListener('load', asyncLoad, false);
  }
})();
</script>

【问题讨论】：

标签： javascript jquery shopify liquid

【解决方案1】：

应用可以使用 ScriptTag API 将 JavaScript 添加到您的 Shopify 网站。 ScriptTag 脚本将出现在几乎任何主题中；这就是为什么他们在你切换到布鲁克林后仍然坚持的原因。如果要删除 ScriptTag 脚本，只需删除添加它的应用即可。

【讨论】：

谢谢乔希。这个回复有点超出我的理解，但我昨天设法在 Shopify 论坛中找到了一个帖子，他们删除了他解释的部分脚本结构，虽然不理想但有效。使它工作并阻止其他引起问题的 JS 的部分是从另一个被调用的脚本中删除“defer="defer"。希望这是有道理的，再次感谢！
很高兴你明白了:)

【解决方案2】：

根据我对 Josh 的回复，我昨天在 Shopify 论坛中找到了一篇帖子，他们删除了部分脚本结构，他解释说这并不理想但有效。使它工作并阻止其他引起问题的 JS 的部分是从另一个被调用的脚本中删除“defer="defer"。希望这是有道理的，再次感谢！

希望这对其他人有所帮助，正如我在 Shopify 论坛中看到的，很多人也对此有疑问。

【讨论】：