Mailchimp 一个列表的多个订阅表格

Posted 2023-03-24

【中文标题】Mailchimp 一个列表的多个订阅表格

【英文标题】：Mailchimp Multiple Subscription Forms for one list

【发布时间】：2015-02-22 16:39:25

【问题描述】：

我在一个指向一个列表的 html 页面中嵌入了三个不同的自定义 mailchimp 表单（每个表单有两个相似的字段和一个不同的隐藏字段）。

除一件事外，一切正常。响应消息（成功或错误）仅在第一个表单的 div #mce-response 中显示在同一页面中。在另外两个中，响应被加载并显示在另一个空白页面中。我希望所有三种表单的响应都显示在同一页面中。 我不是 Java Script 用户，但经过一番研究，我发现这涉及外部脚本：

<script type='text/javascript' src='http://s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script>

有没有办法通过mailchimp设置或者我们必须使用JavaScript文件？

我知道这个脚本只对第一种形式有效。 知道怎么做吗？ 谢谢

【问题讨论】：

您找到解决方案了吗？

【参考方案1】：

显然使用 iframe 是可行的。

请参考this 文章/视频。

文章中的解释文字：

不要将注册表单嵌入代码页面中的代码粘贴到您的网站中，而是将其粘贴到文本文档中（使用 NotePad (PC) 或 TextEdit (Mac)）并将其命名为“signup-form.html”或类似名称那。您可能希望将表单包装在 div 中以进行样式设置并添加一些内联样式。因此 HTML 文档将如下所示：

<style type="text/css">
<!--
lots of CSS to make your form look pretty
//-->
</style>

<div id="sign-up">
at least 50 lines of code copied from MailChimp goes here
</div>

然后将此 HTML 文档（“signup-form.html”或您所称的任何名称）上传到您服务器上的某个位置。

然后为了在页面上嵌入代码（根据需要多次），您可以使用这样的 iframe 调用 HTML：

<iframe src="http://your-site.com/mailchimp-form.html" frameborder="0"  >
<a href="http://link-to-form-on-mailchimp-site" target="_blank">Anchor text saying "click here to sign up" or something like that for people whose browsers can't read iframes</a>
</iframe>

【讨论】：

欢迎提供解决方案的链接，但请确保您的答案在没有它的情况下有用：add context around the link 这样您的其他用户就会知道它是什么以及为什么会出现，然后quote the most relevant part of the page 你'正在链接到，以防目标页面不可用。 Answers that are little more than a link may be deleted.

【参考方案2】：

使用 Ajax Chimp。这将 (1) 防止将您的订阅者从您的页面重定向，并 (2) 允许多种形式。

https://github.com/scdoshi/jquery-ajaxchimp

【参考方案3】：

如果您将每个 mailchimp 表单包装在一个 .... 中，然后在页面上运行此脚本，它将重新分配非焦点表单的所有 ID，并重新绑定提交事件。有点hacky，但如果你处于绑定状态，它就可以工作。

// only execute if confirmed more than 1 mailchimp form on this page
$(document).ready(function() 

    if ( $('.mc-form-instance').length > 1 ) 

        $('.mc-field-group > .required').on('focus', function() 
            var thisField = $(this);

            // backup all mc-form ids on this page
            $('.mc-form-instance [id]').each(function() 
                var currentID = $(this).attr('id');
                if ( currentID.indexOf('-bak') == -1 ) 
                    $(this).attr('id', currentID + '-bak');
                
            );
            // change the current form ids back to original state
            var thisForm = thisField.closest('.mc-form-instance');
            thisForm.find('[id]').each(function() 
                var currentID = $(this).attr('id');
                if ( currentID.indexOf('-bak') != -1 ) 
                    $(this).attr('id', currentID.replace('-bak', ''));
                
            );
        );

        // re-bind
        $.getScript('//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js');
    
);