使用MailChimp配置Ghost博客邮件订阅教程

本篇文章转自402's Blog

之前已经写过Ghost配置邮件订阅的方法，不过没有单独拿出来说。

最近搭建新网站又重新梳理了一下流程，给大家参考。全文以Ghost博客系统为例，也适用于其他博客站，感兴趣Ghost的可以访问这里了解一下。

MailChimp简介

市面上提供邮件订阅托管服务的站点很多，Mailchimp是很棒的一个，实际使用过程中非常符合我界面清爽，使用简单的要求。

Mailchimp的配置主要分为两个部分：List和Campaigns，

Campaign直译为一个活动，从一个博客、一个App中定期发出的邮件都可以成作为一个活动；List更为重要，它的目的是管理你的订阅者，订阅者订阅时并不是直接订阅一个博客网站或者一个Campaign，而是订阅某个List，每个Campaign都指定向某个List发送邮件。

MailChimp List

List的配置分为如下几个步骤：

填写List基本信息

进入Lists页面点击创建会进入下方这个页面：

1. 首先给List取个名字；

2. Default "from" email，订阅者收到邮件（newsletter）时显示的发件邮箱；

3. Default "from" name，订阅者收到邮件时显示的发件人；

4. 在下一行是自定义一个用户订阅时会看到的提示注册文案，点击输入框之后下方会有一些提示的示例文案，在这里卖萌、求搞基就都随你了；

5. 在下方的联系方式是从你注册时填写的profile里面读取的，你也可以随意修改；

6. Notifications配置用户订阅后发送给你的提示邮件方式；

7. 点击save保存。

通过List管理订阅者

完成之后进入下方这个界面，一开始你是没有订阅者的，可以添加几个用于测试的订阅者或者导入其他订阅者，添加的时候会提醒你需要到订阅的邮箱中确认。

给订阅者一个友好的交互界面

当我们点击某个博客的订阅链接时（比如点击我的博客左侧的订阅按钮），我们会看到类似下方的页面：

那么接下来就通过Signup forms来创建用户订阅时看到的页面和用于配置到订阅按钮上的跳转到订阅页面的链接。首先切换到Signup forms页面：

先尝试使用普通方式General froms创建，这种方式会提供给你一个页面链接和一个独立的页面，当然你也可以通过Embeded forms这种方式获取HTML代码嵌入到自己的网站页面。

点击General froms后进入下面这个创建Form的页面：

对创建时遇到的一些选项简单说明一下：

1. From and response emails选择当前配置的是哪个页面，如：订阅页面（Signup Form）、订阅后的致谢页面（Signup "thank you" page）、取消订阅页面（Unsubscribe Form）等等。下面的两个勾选项点击后面的info可以了解详细信息，可以先不勾选。以订阅页面为例看下下面的配置；

2. Signup form URL很重要，默认生成的URL用于配置到Ghost博客上，点击后跳转到博客订阅页面，保存下来，后边配置vno主题时会用到。后面两个按钮可以分享订阅URL到facebook和twitter，最后一个QR按钮点击会生成一个访问订阅页面的二维码；

3. 再下面是订阅页面的编辑区域，可以自定义展现给订阅者的页面。页面是实时刷新的，编辑完之后不需要保存。

配置订阅页面链接到博客站点

这里就因博客站点而异了，不过通常这些位置都比较明显，比如Ghost根据主题可能有所不同，vno这个主题的话在side-panel.hbs这个文件中配置，很容易找到：

这个时候如果有用户点击你的博客订阅按钮的话，就可以访问刚才的页面直接订阅了。

MailChimp Campaigns

有了List之后就可以创建新的Campaign了，Campaign就好像是一个一直在MailChimp上跑的属于你的程序，根据你配置的规则进行定期发送邮件等活动。

进入Campaign页面创建一个Campaign：

1. 首先选择Campaign的类型，传统的博客都支持RSS订阅系统，我们这里选择基于RSS的Campaign类型RSS campaign；

2. 页面的最下方列出了配置的步骤，按照引导一步一步走下去。当前步骤配置好之后点击next进入下一步，后续想要跳回来修改某一步的时候也可以直接点击右上角的Save and Exit直接退出编辑页面；

上面这一步里面有如下几个地方要说明：

3. RSS Feed：先填写博客RSS Feed URL，比如Ghost博客默认的rss链接是your-blog-url.com/rss，也可以直接把博客的域名添进去，Mailchimp会帮你找到rss的地址。下面再配置一下发邮件的频率和时间，点击next进入下一步；

4. Recipients：在这一步用到了我们之前创建的List，选择一个List，并指定是发给整个List还是某个segment；

5. Setup：还是那点事儿，取个名字，取个标题（Email subject），值得一提的是这里允许使用一些可变文字标签*|RSSFEED:TITLE|*、*|RSSFEED:DATE|*、*|FNAME|*等等。Tracking和Social media部分根据实际情况配置；

6. Template：MailChimp提供了很多模板或者已经设计好的主题，用于展示发送给订阅者的邮件格式。这个界面是即将发送给订阅者的邮件界面，和List提供给订阅者的订阅界面不同。

7. Design：选择好模板之后进入设计页面；如果是选择Basic的模板，别忘了至少要把RSS Items这个组件放到你的页面里面，方便订阅者收到邮件后知道有哪些更新。设计好之后点击next进入最后的Confirm页面；

8. Confirm：这个页面用来确认之前的配置，某一处配置有问题的话会给一个错误，例如这里指定的List里面没有订阅者；

解决掉所有错误之后保存、完成，MailChimp会给你猩猩手势的动画。Campaign配置完成，MailChimp会检查当日是否有RSS博客更新，如果有的话就会在指定好的时间发送一封邮件给List内的订阅者，MailChimp还会整理周更新发给订阅者。

配置Vno主题博客

最后我们还需要配置一下Vno主题中的订阅入口。用户点击首页的订阅按钮就会跳转到MailChimp某个List的订阅页面。

进入到/var/www/ghost/content/themes/vno目录下用vim或者nano编辑partials/side-panel.hbs文件，找到

订阅

所在的这一行，把http://your-blog-url.com/rss替换为之前创建的MailChimp List的Signup URL。

保存退出。重启Ghost服务。

service ghost restart

Vno主题的邮件订阅功能配置完成，点击订阅后的效果如下：

Mailchimp还提供了跟踪统计功能，虽然有些Pro功能需要付费使用，但是没事看看博客订阅者的浏览率等等数据也挺好玩儿的。

RSS订阅页面问题的解决

配置邮件订阅RSS的时候还遇到了一个问题，就是我的某篇博客里面引用到了一个非UTF－8的字符，导致访问我的RSS源页面界面出错：

可以看到RSS没有了格式并且报错：error on line 314 at column 941: Input is not proper UTF-8, indicate encoding !，说明在314行的这个位置有一个非法字符，往往是因为使用了其他编辑器写博文，或者从某个地方拷贝内容到博客中时不慎拷贝了一些非法字符进来。怎么解决呢？

很简单，直接到这个页面的最下方去找，可以看到某篇博客的信息被截断了，那么很可能就是这一篇博客的内容除了问题。去后台把这一篇的内容全删掉验证一下（当然要先找个地方保存起来），如果rss页面恢复正常如下：

那么可以确定时刚才删掉的内容里面有问题。这个时候可以把之前的内容逐步恢复回去再刷新rss页面看看，更有效的办法是粘贴到一些编辑器里面，特殊字符会明显和UTF－8字符不一样，很好分辨（但是要注意某些文档编辑器可能直接在显示上帮你忽略了这些非法字符，建议用Sublime Text2，或者一些你熟悉的编辑器查看），从下面的图中可以很容易的看到这个出错的字符：

删掉它们再重新发布这篇博客就好了。

就先写这么多，还有一点要说的就是要避免自己发出的订阅邮件被Gamil等邮箱当做垃圾邮件，知乎上有个不错的回答可以参考：知乎群发的「知乎每周精选」是如何不被当作垃圾邮件的？