Html 使用他们的 API 创建一个基本的 MailChimp 注册表单

Question

提问by Sparky

I'm new to MailChimp and need some help.

我是 MailChimp 的新手，需要一些帮助。

With their basic newsletter signup form... you simply embed some prepackaged HTML into your page. However the problem with this is that clicking on submit redirects to a MailChimp page. (I don't want to redirect to MailChimp, I want the user to stay on own website after hitting submit.)

使用他们的基本时事通讯注册表单...您只需将一些预先打包的 HTML 嵌入到您的页面中。然而，问题在于点击提交会重定向到 MailChimp 页面。（我不想重定向到 MailChimp，我希望用户在点击提交后留在自己的网站上。）

They provide an API and plenty of documentation but just about zero useful examples. The API is supposed to allow me to do a full integration with my site or application. It seems that when I read something in their docs that applies to me, I click the link to get more information and I end up going around in circles. They tell you how to do it but they fail to "show" you how to it.

他们提供了一个 API 和大量的文档，但有用的例子几乎为零。API 应该允许我与我的站点或应用程序进行完全集成。似乎当我在他们的文档中阅读了一些适用于我的内容时，我点击了链接以获取更多信息，但最终却转了一圈。他们告诉你如何去做，但他们没有“展示”你如何去做。

I can get an API Key, they have tons of documentation, and a whole bunch of wrappers & plugins... PHP, Drupal, Wordpress, etc...

我可以获得一个 API 密钥，他们有大量的文档，以及一大堆包装器和插件...... PHP、Drupal、Wordpress 等......

The confusion here regarding their pre-packaged solutions is that I just have a regular static HTML page, it's not Wordpress, PHP, or Drupal... so I just don't know where to start ... I don't even know if I'm supposed to use POSTor GET.

这里关于他们预先打包的解决方案的困惑是我只有一个常规的静态 HTML 页面，它不是 Wordpress、PHP 或 Drupal……所以我只是不知道从哪里开始……我什至不知道如果我应该使用POSTor GET。

I'm not a newbie to API's... I do very well with getting the Google Maps API to do whatever I want. However, Google provides real-world working examples in addition to their detailed documentation which is how I learned it. I just want to see it in action before I can grasp the finer points of the API.

我不是 API 的新手……我很擅长让 Google Maps API 做任何我想做的事情。然而，除了详细的文档之外，谷歌还提供了真实世界的工作示例，这是我学习它的方式。我只是想在掌握 API 的细节之前看到它的实际效果。

Without any solid examples or tutorials in their online documentation, I'm asking how to create the most basic HTML signup form using their API.

在他们的在线文档中没有任何可靠的示例或教程，我问的是如何使用他们的 API 创建最基本的 HTML 注册表单。

Answer 1

采纳答案by Sparky

EDITED:

编辑：

Since posting this answer MailChimp has released version 2 & 3 of their API. Version 3 will be the only supported version starting in 2017. As soon as I have a chance to test it, I will update this answer for API version 3.

自从发布此答案后，MailChimp 已发布其 API 的第 2 版和第 3 版。从 2017 年开始，版本 3 将是唯一受支持的版本。一旦我有机会对其进行测试，我将针对 API 版本 3 更新此答案。

MailChimp API v3.0

As per notification at the top of this page, all prior versions of the API will not be supported after 2016.

根据本页顶部的通知，2016 年后将不再支持所有先前版本的 API。

My solution uses PHP in the background for handling the API, and jQuery to facilitate the Ajax.

我的解决方案在后台使用 PHP 来处理 API，使用 jQuery 来方便 Ajax。

1) Download a PHP wrapper that supports API v3.0. As of this writing, there is nothing official listed in the latest MailChimp docs that supports v3.0, but several are listed on GitHub, so I selected this one.

1) 下载支持 API v3.0 的 PHP 包装器。在撰写本文时，最新的 MailChimp 文档中没有任何官方列出支持 v3.0 的内容，但在 GitHub 上列出了几个，所以我选择了这个。

2) Create the following PHP file, store-address.php, using your own API key and list ID, and then place it in the same directory as the wrapper from step one. Remember to follow the documentation for your wrapper, but they all seem fairly similar to this.

2)store-address.php使用您自己的 API 密钥和列表 ID创建以下 PHP 文件，然后将其放置在与第一步中的包装器相同的目录中。请记住遵循包装器的文档，但它们看起来都与此非常相似。

<?php // for MailChimp API v3.0

include('MailChimp.php');  // path to API wrapper downloaded from GitHub

use \DrewM\MailChimp\MailChimp;

function storeAddress() {

    $key        = "xxxxxxxxxxxxxxx-us1";
    $list_id    = "xxxxxx";

    $merge_vars = array(
        'FNAME'     => $_POST['fname'],
        'LNAME'     => $_POST['lname']
    );

    $mc = new MailChimp($key);

    // add the email to your list
    $result = $mc->post('/lists/'.$list_id.'/members', array(
            'email_address' => $_POST['email'],
            'merge_fields'  => $merge_vars,
            'status'        => 'pending'     // double opt-in
            // 'status'     => 'subscribed'  // single opt-in
        )
    );

    return json_encode($result);

}

// If being called via ajax, run the function, else fail

if ($_POST['ajax']) { 
    echo storeAddress(); // send the response back through Ajax
} else {
    echo 'Method not allowed - please ensure JavaScript is enabled in this browser';
}

3) Create your HTML/CSS/JavaScript(jQuery) form (It is not required to be on a PHP page, and the visitor will never see that PHP is being used in the background.)

3) 创建您的 HTML/CSS/JavaScript(jQuery) 表单（不需要在 PHP 页面上，访问者永远不会看到后台正在使用 PHP。）

The response is in JSON so you'll have to handle it correctly.

响应采用 JSON 格式，因此您必须正确处理它。

Here is what my index.htmlfile looks like:

这是我的index.html文件的样子：

<form id="signup" action="index.html" method="get">
    First Name: <input type="text" name="fname" id="fname" />
    Last Name: <input type="text" name="lname" id="lname" />
    email Address (required): <input type="email" name="email" id="email" />
    <input type="submit" id="SendButton" name="submit" value="Submit" />
</form>
<div id="message"></div>

<script src="jquery.min.js"></script>
<script>
$(document).ready(function() {
    $('#signup').submit(function() {
        $("#message").html("Adding your email address...");
        $.ajax({
            url: 'inc/store-address.php', // proper url to your "store-address.php" file
            type: 'POST', // <- IMPORTANT
            data: $('#signup').serialize() + '&ajax=true',
            success: function(msg) {
                var message = $.parseJSON(msg),
                    result = '';
                if (message.status === 'pending') { // success
                    result = 'Success!  Please click the confirmation link that will be emailed to you shortly.';
                } else { // error
                    result = 'Error: ' + message.detail;
                }
                $('#message').html(result); // display the message
            }
        });
        return false;
    });
});
</script>

MailChimp API version 1:

MailChimp API 版本 1：

(original answer)

（原答案）

After fumbling around for a while, I found a site using the PHP example with jQuery. From that I was able to create a simple HTML page with jQuery containing the basic sign-up form. The PHP files are "hidden" in the background where the user never sees them yet the jQuery can still access & use.

在摸索了一段时间后，我找到了一个使用 PHP 示例和 jQuery 的站点。从那以后，我能够使用包含基本注册表单的 jQuery 创建一个简单的 HTML 页面。PHP 文件“隐藏”在后台，用户永远看不到它们，但 jQuery 仍然可以访问和使用。

1) Download the PHP 5 jQuery example here... (EDIT: links are dead. However, the only important part is the official API wrapper for PHP which is available HERE.)

1）在此处下载 PHP 5 jQuery 示例...（编辑：链接已失效。但是，唯一重要的部分是 PHP 的官方 API 包装器，可在此处获得。）

~~http://apidocs.mailchimp.com/downloads/mcapi-simple-subscribe-jquery.zip~~

If you only have PHP 4, simply download version 1.2 of the MCAPI and replace the corresponding MCAPI.class.phpfile above.

如果您只有 PHP 4，只需下载 MCAPI 的 1.2 版并替换MCAPI.class.php上面的相应文件。

~~http://apidocs.mailchimp.com/downloads/mailchimp-api-class-1-2.zip~~

2) Follow the directions in the Readme file by adding your API key and List ID to the store-address.phpfile at the proper locations.

2) 按照自述文件中的说明将您的 API 密钥和列表 ID 添加到store-address.php文件的适当位置。

3) You may also want to gather your users' name and/or other information. You have to add an array to the store-address.phpfile using the corresponding Merge Variables.

3) 您可能还想收集用户的姓名和/或其他信息。您必须store-address.php使用相应的合并变量将数组添加到文件中。

Here is what my store-address.phpfile looks like where I also gather the first name, last name, and email type:

这是我的store-address.php文件的样子，我还收集了名字、姓氏和电子邮件类型：

<?php

function storeAddress() {

    require_once('MCAPI.class.php');  // same directory as store-address.php

    // grab an API Key from http://admin.mailchimp.com/account/api/
    $api = new MCAPI('123456789-us2');

    $merge_vars = Array( 
        'EMAIL' => $_GET['email'],
        'FNAME' => $_GET['fname'], 
        'LNAME' => $_GET['lname']
    );

    // grab your List's Unique Id by going to http://admin.mailchimp.com/lists/
    // Click the "settings" link for the list - the Unique Id is at the bottom of that page. 
    $list_id = "123456a";

    if ($api->listSubscribe($list_id, $_GET['email'], $merge_vars , $_GET['emailtype'])) {
        // It worked!   
        return 'Success!&nbsp; Check your inbox or spam folder for a message containing a confirmation link.';
    } else {
        // An error ocurred, return error message   
        return '<b>Error:</b>&nbsp; ' . $api->errorMessage;
    }

}

// If being called via ajax, autorun the function
if($_GET['ajax']) { 
    echo storeAddress(); 
}

4) Create your HTML/CSS/jQuery form. It is not required to be on a PHP page.

4) 创建您的 HTML/CSS/jQuery 表单。它不需要在 PHP 页面上。

Here is what my index.htmlfile looks like:

这是我的index.html文件的样子：

<form id="signup" action="index.html" method="get">
    First Name: <input type="text" name="fname" id="fname" />
    Last Name: <input type="text" name="lname" id="lname" />
    email Address (required): <input type="email" name="email" id="email" />
    HTML: <input type="radio" name="emailtype" value="html" checked="checked" />
    Text: <input type="radio" name="emailtype" value="text" />
    <input type="submit" id="SendButton" name="submit" value="Submit" />
</form>
<div id="message"></div>

<script src="jquery.min.js"></script>
<script>
$(document).ready(function() {
    $('#signup').submit(function() {
        $("#message").html("Adding your email address...");
        $.ajax({
            url: 'inc/store-address.php', // proper url to your "store-address.php" file
            data: $('#signup').serialize() + '&ajax=true',
            success: function(msg) {
                $('#message').html(msg);
            }
        });
        return false;
    });
});
</script>

Required pieces...

需要的零件...

index.htmlconstructed as above or similar. With jQuery, the appearance and options are endless.
store-address.phpfile downloaded as part of PHP examples on Mailchimp site and modified with your API KEYand LIST ID. You need to add your other optional fields to the array.
MCAPI.class.phpfile downloaded from Mailchimp site (version 1.3 for PHP 5 or version 1.2 for PHP 4). Place it in the same directory as your store-address.phpor you must update the url path within store-address.phpso it can find it.

index.html构造如上或类似。使用 jQuery，外观和选项是无穷无尽的。
store-address.php文件作为 Mailchimp 站点上 PHP 示例的一部分下载，并使用您的API KEY和LIST ID 进行修改。您需要将其他可选字段添加到数组中。
从 Mailchimp 站点下载的MCAPI.class.php文件（PHP 5 的 1.3 版或 PHP 4 的 1.2 版）。将它放在与store-address.php相同的目录中，或者您必须更新store-address.php 中的 url 路径，以便它可以找到它。

Answer 2

回答by Jonas ?ppelgran

Here is an example using version 2.0of Mailchimp API together with mailchimp-api(a minimal php abstraction class for dealing with the Mailchimp API).

这是一个使用2.0 版Mailchimp API 和mailchimp-api（用于处理 Mailchimp API 的最小 php 抽象类）的示例。

<?php

include('MailChimp.php');

$MailChimp = new MailChimp('API_KEY');
$result = $MailChimp->call('lists/subscribe', array(
    'id'                => 'LIST_ID',
    'email'             => array( 'email' => $_POST['email'] ),
    'merge_vars'        => array(
        'MERGE2' => $_POST['name'] // MERGE name from list settings
        // there MERGE fields must be set if required in list settings
    ),
    'double_optin'      => false,
    'update_existing'   => true,
    'replace_interests' => false
));

if( $result === false ) {
    // response wasn't even json
}
else if( isset($result->status) && $result->status == 'error' ) {
    // Error info: $result->status, $result->code, $result->name, $result->error
}

?>

Read more about what you can send with the API call at the MailChimp API Documentation.

在MailChimp API 文档中阅读有关您可以通过 API 调用发送的内容的更多信息。

Answer 3

回答by davidnknight

Here's another example of using version 2.0 of the Mailchimp API using the Official PHP Wrapper.

这是使用官方 PHP Wrapper使用 Mailchimp API 2.0 版的另一个示例。

The difference between my example and others posted here is that I'm using the subscribemethod of the Mailchimp_Listsclass, accessible through instantiation of the Mailchimp class (->lists), rather than the generic callmethod.

我的示例与此处发布的其他示例之间的区别在于，我使用的是Mailchimp_Lists类的subscribe方法，可通过 Mailchimp 类 ( ) 的实例化访问，而不是通用调用方法。->lists

$api_key = "MAILCHIMP_API_KEY";
$list_id = "MAILCHIMP_LIST_ID";

require('Mailchimp.php');
$Mailchimp = new Mailchimp($api_key);
$subscriber = $Mailchimp->lists->subscribe($list_id, array('email' => $_POST['email']));

if ( ! empty($subscriber['leid'])) {
    // Success
}

Html 使用他们的 API 创建一个基本的 MailChimp 注册表单

提问by Sparky

采纳答案by Sparky

MailChimp API v3.0

MailChimp API v3.0

MailChimp API version 1:

MailChimp API 版本 1：

回答by Jonas ?ppelgran

回答by davidnknight

相关推荐

最近更新

标签

Html 使用他们的 API 创建一个基本的 MailChimp 注册表单

提问by Sparky

采纳答案by Sparky

MailChimp API v3.0

MailChimp API v3.0

MailChimp API version 1:

MailChimp API 版本 1：

回答by Jonas ?ppelgran

回答by davidnknight

相关推荐

Html 如何转义 URL 中的哈希字符

Html H 标题 + 同一行上的其他一些文本

Html 左、中、右对齐同一行底部的 div

Html 标题为两侧的水平线

相关推荐

最近更新

标签