README

一个将表单连接到Mailchimp的最小Craft插件

Composer | 重要

Craft 5

"require": {
"leowebguy/simple-mailchimp": "^3.0",
}

Craft 4

"require": {
   "leowebguy/simple-mailchimp": "^2.0",
}

Craft 3

"require": {
   "leowebguy/simple-mailchimp": "^1.0.4",
}

安装

composer require leowebguy/simple-mailchimp

在控制面板上，转到设置 → 插件 → "Simple Mailchimp" → 安装

凭证

从Mailchimp收集必要的信息

API密钥 MC_API_KEY

转到 https://admin.mailchimp.com/lists > 选择受众 > 设置 > 受众名称和默认值 > 受众ID

受众ID MC_LIST_ID

转到 https://admin.mailchimp.com/account/api/ > API密钥

将凭证添加到插件设置中

您还可以使用上面示例中的.env参数。

# Mailchimp
MC_API_KEY=xxx12345x1234x123xxx123xxxxx123xx-us14
MC_LIST_ID=xxx1234xx1234

使用方法

您的时事通讯表单模板可以看起来像这样

<form method="post" id="mailchimp">
    {{ csrfInput() }}
    <input type="hidden" name="tags" value="Tag_1,Tag_2">
    <input type="text" name="name">
    <input type="email" name="email">
    <button type="submit">Submit</button>
</form>

唯一的必填字段是email，其余都是可选的

使用以下纯js示例

const form = document.getElementById('#mailchimp')
form.onsubmit = (e) => {
    e.preventDefault();
    fetch('/mailchimp/send', {
        method: 'post',
        body: new FormData(this)
    })
    .then((r) => r.json())
    .then((r) => {
        if (r.success) {
            alert(r.msg)
        } else {
            alert(r.msg)
        }
    })
    .catch((e) => {
        console.error(e);
    });
};

或jQuery/ajax...

$('form#mailchimp').submit((e) => {
    e.preventDefault();
    $.post({
        url: '/mailchimp/send',
        data: $(this).serialize(),
        success: (r) => {
            if (r.success) {
                alert(r.msg)
            } else {
                alert(r.msg)
            }
        },
        error: (e) => {
            console.error(e);
        }
    });
});