Mailer加持，让博客体验更完善

[notice]从建立这个博客开始，自始至终都没有说会想过未来真的会有人读你写的东西，甚至给你留下评论。[/notice]

前言

好吧当时其实也没有想太多，因为对这个邮件回复其实是有一些误解。这是怎么回事呢：

我一直认为：想让Typecho给你自动发送邮件来跟踪你的评论消息其实很困难。

但是就在昨天晚上，我不知道怎么的，就访问别的大佬的站内，看一些文章。偶尔一下就发现，他写到的有关邮件回复的文章：邮件评论回复插件这时我也想到了为何不尝试一下这样的“新鲜事”呢 :@(深思) Maybe在我看来这已经很新鲜了好嘛说做就做！

过程

参照教程，看着看着就感觉不对了，咦！怎么是熊猫小A写的，正好我的主题也是他写的！鬼晓得当时我居然没发现这个插件就正好给我的小站整上个“全家桶” :@(赞一个)

首先说一下我搭建前的一个环境：Typecho我使用的是最新的正式版本，但听说只有开发版才有这个插件所需要的接口，所以说只能将你的博客站升级到开发版后才能使用这个插件。哦对了忘记介绍了，这次的插件就是它：Mailer：又一款评论邮件提醒插件

不过呢在安装之前，首先做的事就是要[notice]备份！ 备份！ 备份！[/notice]因为开发板和正式版不同，一旦出现问题数据无价！经历了惨痛崩坏的我，说多了都是泪 :@(装大款)

1. 前往Typecho官方网站下载页找到开发版下载
2. 下载build文件，将原网站目录下的admin var index.php删除。
3. 解压build文件后，将admin var index.php重新粘贴至网站目录上传，即可。
4. 打开博客站后台，可以发现升级的提示，点击升级

升级到开发版后，其实观察了一下，并没有什么太大变化，原来启用的插件/主题都可以使用。不过新增加了直接预览还未发布的文章，这点倒是挺好的，虽然说文本编辑页也是有预览的，但效果显然没有这个好，这边点个赞！ ::(真棒)

接下来我们就可以安装插件了，前往插件的Github页面，下载后上传至网站根目录usr中的Plugin文件夹下。
[notice]一定要更改解压后的文件夹名为Mailer否则会出现 Database 500 error报错问题[/notice]

接下来配置插件很重要。这边我另外提一下，我使用了QQ的域名邮箱服务，且我去了解到域名邮箱也是有SMTP服务的，可以作为发件邮箱，这样就免去了企业邮箱或绑定域名邮箱的必须，但如果你也有同样的SMTP邮箱服务，也可以使用，这边只是介绍一下其实QQ邮箱还是有这个服务的，既然有的话就利用起来也是不错哒 ::(滑稽) [notice]QQ域名邮箱支持域名有限，如.COM/.CN/.NET等，有些可能不支持，注册域名时请斟酌选择。[/notice]

[notice]这里需要注意，填写密码时，请先前往QQ邮箱设置中账户页下的POP3/IMAP/SMTP服务中开启POP3/SMTP服务，验证您的身份后就会生成一个授权码，将生成的授权码填写至密码一栏即可。如果出现发送指令失败的服务，可以更换端口与协议重试后即可[/notice]

到这里，插件基本上就配置完了。如果你也和我一样使用VOID主题，那么到这里就设置完成了；但如果你使用的是其他主题，你需要将一下代码添加至你博客评论的文件中（一般为comments.php）：

<span>
  <input name="receiveMail" type="checkbox" value="yes" checked />
  <label for="receiveMail"><strong>接收</strong>邮件通知</label>
</span>

你还可以更改发件模板，让你的邮件看起来更加棒！这边我也提供我使用的两个模板：

针对博主的邮件模板

<div style="width: 620px;height: auto;border-radius: 5px;margin:0 auto;box-shadow: 0px 0px 20px #888888;position: relative;">
    <div style="background-image: url(https://img.moegirl.org/common/b/b9/%E6%8A%98%E6%9C%A8.jpg);width:620px;height: 287px;background-size: cover;background-repeat: no-repeat;border-radius: 5px 5px 0px 0px;"></div>
    <div style="background-color:white;line-height:180%;padding:0 15px 12px;width:520px;margin:10px auto;color:#555555;font-family:'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size:12px;margin-bottom: 0px;">
        <h2 style="font-size:14px;font-weight:normal;padding:13px 0 10px 8px;"><span style="color: #ff7272;font-weight: bold;"></span>Master！您编撰的文章 <a style="text-decoration:none;color: #ff7272;" href="{{post_permalink}}" target="_blank">《{{post_title}}》</a> 有了新的回复呐~</h2>
        <div style="padding:0 12px 0 12px;margin-top:18px">
            <p><strong>{{comment_author_name}}</strong>&nbsp;给您的评论：</p>
            <style type="text/css">
                .comment>img{margin: 0px 6px 5px 6px;width: 25px;}
            </style>
            <p class="comment" style="background-color: #f5f5f5;border: 0px solid #DDD;border-radius: 5px;padding: 10px 15px;margin:18px 0">{{comment_content}}</p>
            <p>其他信息：</p>
            <p style="background-color: #f5f5f5;border: 0px solid #DDD;border-radius: 5px;padding: 10px 15px;margin:18px 0">IP Address：{{ip}}<br />Mail：<a style="text-decoration:none;color: #ff7272;" href="mailto:{{comment_author_mail}}">{{comment_author_mail}}</a><br />Status：{{status}} [<a style="text-decoration:none;color: #ff7272;" href='{{manage_url}}' target='_blank'>管理评论</a>]</p>
        </div>
    </div>
    <a style="text-decoration: none;color: rgb(255, 255, 255);width: 40%;text-align: center;background-color: rgb(255, 114, 114);height: 40px;line-height: 40px;box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);display: block;margin: auto;" href="{{comment_permalink}}" target="_blank">点击查看完整內容</a>
    <div style="color:#8c8c8c;;font-family: 'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size: 10px;width: 100%;text-align: center; padding-bottom: 1px;">
        <p>©2019 - 2020 Copyright  {{site_name}} </p>
    </div>
</div>

针对访客的邮件模板

<div style="width: 620px;height: auto;border-radius: 5px;margin:0 auto;box-shadow: 0px 0px 20px #888888;position: relative;padding-bottom: 5px;">
    <div style="background-image: url(https://img.moegirl.org/common/b/b9/%E6%8A%98%E6%9C%A8.jpg);width:620px;height: 287px;background-size: cover;background-repeat: no-repeat;border-radius: 5px 5px 0px 0px;"></div>
    <div style="width: 200px;height: 40px;background-color: rgb(255, 114, 114);margin-top: -20px;margin-left: 20px;box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.3);color: rgb(255, 255, 255);text-align: center;line-height: 40px;">Dear： {{comment_parent_author_name}} </div>
    <div style="background-color:white;line-height:180%;padding:0 15px 12px;width:520px;margin:30px auto;color:#555555;font-family:'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size:12px;margin-bottom: 0px;">  
        <h2 style="font-size:14px;font-weight:normal;padding:13px 0 10px 8px;"><span style="color: #12ADDB;font-weight: bold;"></span>您在 <a style="text-decoration:none;color: #ff7272;" href="{{post_permalink}}" target="_blank">《{{post_title}}》</a> 中的评论有了新的回复呐~</h2>  
        <div style="padding:0 12px 0 12px;margin-top:18px">
            <style type="text/css">
                .comment>img{margin: 0px 6px 5px 6px;width: 25px;}
            </style>
            <p>您的评论：</p>  
            <p class="comment" style="background-color: #f5f5f5;border: 0px solid #DDD;border-radius: 5px;padding: 10px 15px;margin:18px 0">{{comment_parent_content}}</p>  
            <p><strong>{{comment_author_name}}</strong>&nbsp;给您的回复：</p>  
            <p class="comment" style="background-color: #f5f5f5;border: 0px solid #DDD;border-radius: 5px;padding: 10px 15px;margin:18px 0">{{comment_content}}</p>  
        </div>  
    </div>
    <div style="color:#8c8c8c;;font-family: 'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size: 10px;width: 100%;text-align: center;word-wrap:break-word;margin-top: -30px;">
        <p style="padding:20px;">喜欢这里的话，那以后，这里就是你的家了！——《罗小黑战记》</p>
    </div>
    <a style="text-decoration:none; color:#FFF;width: 40%;text-align: center;background-color:#ff7272;height: 40px;line-height: 35px;box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.30);margin: -10px auto;display: block;" href="{{comment_permalink}}" target="_blank">点击查看完整內容</a>
    <div style="color:#8c8c8c;;font-family: 'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size: 10px;width: 100%;text-align: center;margin-top: 30px;">
        <p>本邮件由：最爱Master的邮箱姬 自动发送，请勿直接回复呐~</p>
    </div>
    <div style="color:#8c8c8c;;font-family: 'Century Gothic','Trebuchet MS','Hiragino Sans GB',微软雅黑,'Microsoft Yahei',Tahoma,Helvetica,Arial,'SimSun',sans-serif;font-size: 10px;width: 100%;text-align: center;padding-bottom: 1px;">
        <p>©2019-2020 Copyright {{site_name}}</p>
    </div>
</div>

[notice]上述代码可能会有显示误差，COPY后注意格式！[/notice]

到这里就设置成功啦，最后附上邮箱模板的效果图。

后记
代码部分版权归属纸盒博客 无文字