前些时间，@理随 来找我，问我有没有其他样式的Twikoo邮件模版，也是一直鸽了许久，没空弄。刚好这两天可以摸摸鱼，闲着也是闲着，开工~

使用前置须知

参数释义

参数释义
${SITE_URL}网站链接
${SITE_NAME}网站名字
${POST_URL}文章链接
${PARENT_NICK}被回复人昵称
${PARENT_COMMENT}被回复人的评论内容
${PARENT_IMG}被回复人头像
${NICK}回复人昵称
${COMMENT}回复人评论内容
${IMG}回复人头像
${MAIL}回复人邮件
${IP}回复人 IP 地址

安装方法

  • 将修改好的邮件模版的html用美化压缩工具进行压缩，如：在线html美化工具

  • 将压缩后的html复制进，Twikoo后台 - 邮件通知 的 MAIL_TEMPLATE 和 MAIL_TEMPLATE_ADMIN 对应处

样式一

效果预览

访客端PE样式
访客端PC样式
博主端PE样式
博主端PC样式

样式代码

访客模版 MAIL_TEMPLATE

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<div style="background:#fff">
    <div style="display:flex;position:relative;width:100%;height:206px;background-color:#b7dde1;background-image:linear-gradient(45deg,#b7dde1 0,#e2bfbd 100%);top:0;left:0;justify-content:center">
        <div style="position:absolute;width:152px;height:152px;display:flex;justify-content:center;top:130px">
            <img src="https://s11.ax1x.com/2023/04/20/p9kLm8J.png" style="width:100%;height:100%;border-radius:50%;border:4px solid #f0f0f2;object-fit:cover">
        </div>
    </div>
    <div style="margin-top:92px;display:flex;flex-direction:column;align-items:center">
        <div style="display:flex;flex-direction:column;align-items:center;margin:0 20px">
            <span style="font-size:26px;font-family:PingFang-SC-Bold,PingFang-SC;font-weight:700;color:#000;line-height:37px;text-align:center">
                嘿~ 您在&nbsp;${SITE_NAME}&nbsp;博客中收到一条新回复！
            </span>
            <span style="font-size:16px;font-family:PingFang-SC-Bold,PingFang-SC;font-weight:700;color:#00000030;line-height:22px;margin-top:21px;text-align:center">
                一条来自&nbsp;${NICK}&nbsp;的回复~
            </span>
        </div>
        <div style="margin:0 20px;min-height:128px;background:#f7f9fe;border-radius:12px;margin-top:34px;display:flex;flex-direction:column;align-items:flex-start;padding:32px 16px;width:calc(100% - 40px)">
            <div style="display:flex;flex-direction:column;margin-left:30px;margin-bottom:16px">
                <span style="height:22px;font-size:16px;font-family:PingFang-SC-Bold,PingFang-SC;font-weight:700;color:#c5343e;line-height:22px">
                    您的评论：
                </span>
                <span style="margin-top:6px;margin-right:22px;font-size:16px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#000;line-height:22px">
                    ${PARENT_COMMENT}
                </span>
            </div>
            <hr style="display:flex;position:relative;border:1px dashed #ef859d2e;box-sizing:content-box;height:0;overflow:visible;width:100%">
            <div style="display:flex;flex-direction:column;margin-left:30px">
                <hr>
                <span style="height:22px;font-size:16px;font-family:PingFang-SC-Bold,PingFang-SC;font-weight:700;color:#c5343e;line-height:22px">
                    回复者：${NICK}
                </span>
                <span style="margin-top:6px;margin-right:22px;font-size:16px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#000;line-height:22px">
                    ${COMMENT}
                </span>
            </div>
            <a style="min-width:106px;height:38px;background:#b7dde1;border-radius:32px;display:flex;align-items:center;justify-content:center;text-decoration:none;margin:auto;margin-top:32px" href="${POST_URL}">
                <span style="color:#000;font-size:14px;font-weight:600">查看详情</span>
            </a>
        </div>
        <div style="display:flex;flex-direction:column;align-items:center;margin-top:34px;margin-bottom:17px">
            <span style="height:17px;font-size:12px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#000;line-height:17px;opacity:.7">
                此邮件由评论服务自动发出，直接回复无效！
            </span>
            <a style="height:17px;font-size:12px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#db214b;line-height:17px;margin-top:6px;text-decoration:none" href="${SITE_URL}">
                前往博客
            </a>
        </div>
    </div>
</div>

博主模版 MAIL_TEMPLATE_ADMIN

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
<div style="background:#fff">
    <div style="display:flex;position:relative;width:100%;height:206px;background-color:#b7dde1;background-image:linear-gradient(45deg,#b7dde1 0,#e2bfbd 100%);top:0;left:0;justify-content:center">
        <div style="position:absolute;width:152px;height:152px;display:flex;justify-content:center;top:130px">
            <img src="https://s11.ax1x.com/2023/04/20/p9kLm8J.png" style="width:100%;height:100%;border-radius:50%;border:4px solid #f0f0f2;object-fit:cover">
        </div>
    </div>
    <div style="margin-top:92px;display:flex;flex-direction:column;align-items:center">
        <div style="display:flex;flex-direction:column;align-items:center;margin:0 20px">
            <span style="font-size:26px;font-family:PingFang-SC-Bold,PingFang-SC;font-weight:700;color:#000;line-height:37px;text-align:center">
                嘿~ 您的博客&nbsp;${SITE_NAME}&nbsp;收到一条新回复！
            </span>
            <span style="font-size:16px;font-family:PingFang-SC-Bold,PingFang-SC;font-weight:700;color:#00000030;line-height:22px;margin-top:21px;text-align:center">
                一条来自&nbsp;${NICK}&nbsp;的评论~
            </span>
        </div>
        <div style="margin:0 20px;min-height:128px;background:#f7f9fe;border-radius:12px;margin-top:34px;display:flex;flex-direction:column;align-items:flex-start;padding:32px 16px;width:calc(100% - 40px)">
            <div style="display:flex;flex-direction:column;margin-left:30px;margin-bottom:16px">
                <span style="height:22px;font-size:16px;font-family:PingFang-SC-Bold,PingFang-SC;font-weight:700;color:#c5343e;line-height:22px">
                    评论者：${NICK}
                </span>
                <span style="margin-top:3px;margin-right:22px;font-size:16px;font-family:PingFangSC-Regular,PingFang SC;font-weight:700;color:#c5343e;line-height:22px">
                    评论者IP：${IP}
                </span>
                <span style="margin-top:3px;margin-right:22px;font-size:16px;font-family:PingFangSC-Regular,PingFang SC;font-weight:700;color:#c5343e;line-height:22px">
                    评论者邮箱：${MAIL}
                </span>
                <span style="margin-top:9px;margin-right:22px;font-size:16px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#c5343e;line-height:22px">
                    文章地址：${POST_URL}
                </span>
            </div>
            <hr style="display:flex;position:relative;border:1px dashed #ef859d2e;box-sizing:content-box;height:0;overflow:visible;width:100%">
            <div style="display:flex;flex-direction:column;margin-left:30px">
                <hr>
                <span style="height:22px;font-size:16px;font-family:PingFang-SC-Bold,PingFang-SC;font-weight:700;color:#c5343e;line-height:22px">
                    评论内容：
                </span>
                <span style="margin-top:6px;margin-right:22px;font-size:16px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#000;line-height:22px">
                    ${COMMENT}
                </span>
            </div>
            <a style="min-width:106px;height:38px;background:#b7dde1;border-radius:32px;display:flex;align-items:center;justify-content:center;text-decoration:none;margin:auto;margin-top:32px" href="${POST_URL}">
                <span style="color:#000;font-size:14px;font-weight:600">
                    查看详情
                </span>
            </a>
        </div>
        <div style="display:flex;flex-direction:column;align-items:center;margin-top:34px;margin-bottom:17px">
            <span style="height:17px;font-size:12px;font-family:PingFangSC-Regular,PingFang SC;font-weight:400;color:#000;line-height:17px;opacity:.7">
                此邮件由评论服务自动发出，直接回复无效！
            </span>
        </div>
    </div>
</div>

原版参考

Twikoo评论回复邮件模板：Acrylic Mail 粉
这篇博文介绍了 Twikoo评论回复邮件模板：Acrylic Mail 粉。博文的作者自己设计了邮件回复模板，并附上了安装和二创原始代码，方便其他用户使用和编辑。同时也讲解了Twikoo邮件自定义的参数含义，方便用户进行魔改。

样式二

效果预览

访客端PE样式
访客端PC样式
博主端PE样式
博主端PC样式

样式代码

访客模版 MAIL_TEMPLATE

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
<div>
    <div id="content">
        <div
            style="background: cornsilk;width: 95%;max-width: 800px;margin: auto auto;border-radius: 5px;border: #49b1f5 1px solid;overflow: hidden;-webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.12);box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.18);   ">
            <header style="overflow: hidden">
                <img src="https://npm.elemecdn.com/hexo-butterfly-envelope/lib/violet.jpg" style="width: 100%; z-index: 666">
            </header>
            <div style="padding: 5px 20px">
                <div class="dear" style="position: relative;color: white;float: left;z-index: 999;background: #49b1f5;padding: 5px 30px;margin: -25px auto 0;box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);">
                    亲爱的 ${PARENT_NICK}：
                </div>
                <br>
                <center>
                    <h3>来自&nbsp;<a style="text-decoration: none; color: #FFAEB9">${NICK}</a>&nbsp;的回复</h3>
                </center>
                <hr style="width:200px;border:0;border-bottom:1px solid #e5e5e5;margin:12px auto;">
                <br>&nbsp; &nbsp;
                <p>您在<a href="${POST_URL}" style="text-decoration: none;color: #49b1f5" target="_blank">&nbsp;${SITE_NAME}&nbsp;</a>上发表的评论：</p>
                <div class="tk-content" style=" border-bottom: #ddd 1px solid; border-left: #ddd 1px solid; padding-bottom: 20px; background-color: #FFFACD; margin: 15px 0px; padding-left: 20px; padding-right: 20px; border-top: #ddd 1px solid; border-right: #ddd 1px solid;  padding-top: 20px;">
                    ${PARENT_COMMENT}
                </div>
                <p><a style="text-decoration: none; color: #FFAEB9">&nbsp;${NICK}</a>&nbsp;给您回复啦：</p>
                <div class="tk-content" style=" border-bottom: #ddd 1px solid; border-left: #ddd 1px solid; padding-bottom: 20px; background-color: #FFFACD;  margin: 15px 0px;  padding-left: 20px; padding-right: 20px; border-top: #ddd 1px solid; border-right: #ddd 1px solid; padding-top: 20px;">
                    ${COMMENT}
                </div>
                <p>欢迎再次光临<a style="text-decoration:none; color:#12addb" href="${SITE_URL}" target="_blank">${SITE_NAME}</a>！</p>
                <p>此邮件由评论服务自动发出，直接回复无效！</p>
                <p>
                    <br>
                </p>
                <div class="chakan" style="text-align: center;">
                    <a href="${POST_URL}" style="color:#ffffff;text-decoration:none;display:inline-block;min-height:28px;line-height:28px;padding:0 13px;outline:0;background:#3eae5f;font-size:13px;text-align: center;font-weight:400;border:0;border-radius:999em" target="_blank">点击去原文查看&gt;&gt;</a>
                </div>
                <div class="footer-p" style="text-align: center; margin-top: 5rem; display:block;color:#b3b3b1;text-decoration:none;">
                    <img src="https://meuicat.com/media/favicon.ico" style="width:1.8rem; margin:0 auto">&nbsp;
                    <hr style="width:165px;border:0;border-bottom:1px solid #e5e5e5;margin:5px auto;">©&nbsp;2021 - 2023&nbsp;
                    <a href="https:/meuicat.com/" style="text-align:center; color: #0da1e6a6" target="_blank">MeuiCat</a>
                </div>
            </div>
        </div>
    </div>
    <style type="text/css">
        .qmbox::-webkit-scrollbar {
            display: none;
        }
        .qmbox #divNeteaseBigAttach,
        .qmbox #divNeteaseBigAttach_bak {
            display: none;
        }
        .qmbox blockquote {
            display: none;
        }
        .qmbox body {
            font-size: 14px;
            font-family: arial, verdana, sans-serif;
            line-height: 1.666;
            padding: 0;
            margin: 0;
            overflow: auto;
            white-space: normal;
            word-wrap: break-word;
            min-height: 100px;
        }
        .qmbox td,
        .qmbox input,
        .qmbox button,
        .qmbox select,
        .qmbox body {
            font-family: Helvetica, 'Microsoft Yahei', verdana;
        }
        .qmbox pre {
            white-space: pre-wrap;
            white-space: -moz-pre-wrap;
            white-space: -pre-wrap;
            white-space: -o-pre-wrap;
            word-wrap: break-word;
            width: 95%;
        }
        .qmbox th,
        .qmbox td {
            font-family: arial, verdana, sans-serif;
            line-height: 1.666;
        }
        .qmbox img {
            border: 0;
        }
        .qmbox header,
        .qmbox footer,
        .qmbox section,
        .qmbox aside,
        .qmbox article,
        .qmbox nav,
        .qmbox hgroup,
        .qmbox figure,
        .qmbox figcaption {
            display: block;
        }
        .qmbox blockquote {
            margin-right: 0px;
        }
        .qmbox a,
        .qmbox td a {
            color: #236da1;
        }
        @media screen and (max-width: 1100px) {
            #content p {
                font-size: 10px;
            }
            #content h3 {
                font-size: 14px;
            }
            .footer-p {
                font-size: 9px;
            }
            .dear {
                font-size: 12px;
            }
        }
    </style>
</div>

博主模版 MAIL_TEMPLATE_ADMIN

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
<div>
    <div id="content">
        <div
            style="background: cornsilk;width: 95%;max-width: 800px;margin: auto auto;border-radius: 5px;border: #49b1f5 1px solid;overflow: hidden;-webkit-box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.12);box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.18);   ">
            <header style="overflow: hidden">
                <img src="https://npm.elemecdn.com/hexo-butterfly-envelope/lib/violet.jpg" style="width: 100%; z-index: 666">
            </header>
            <div style="padding: 5px 20px">
                <div class="dear" style="position: relative;color: white;float: left;z-index: 999;background: #49b1f5;padding: 5px 30px;margin: -25px auto 0;box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.3);">
                    亲爱的 ${SITE_NAME} 博主：
                </div>
                <br>
                <center>
                    <h3>你的博客收到了一条评论！</h3>
                </center>
                <hr style="width:200px;border:0;border-bottom:1px solid #e5e5e5;margin:12px auto;">
                <br>&nbsp; &nbsp;
                <p style="font-weight: bold;color: #49b1f5">&nbsp;评论者信息：&nbsp;</p>
                <div class="tk-content" style=" border-bottom: #ddd 1px solid; border-left: #ddd 1px solid; padding-bottom: 20px; background-color: #FFFACD; margin: 15px 0px; padding-left: 20px; padding-right: 20px; border-top: #ddd 1px solid; border-right: #ddd 1px solid;  padding-top: 20px;">
                    评论者：${NICK}<br>评论者IP：${IP}<br>评论者邮箱：${MAIL}<br>文章评论地址：${POST_URL}
                </div>
                <p><a style="text-decoration: none; color: #FFAEB9">&nbsp;${NICK}</a>&nbsp;的评论内容：</p>
                <div class="tk-content" style=" border-bottom: #ddd 1px solid; border-left: #ddd 1px solid; padding-bottom: 20px; background-color: #FFFACD;  margin: 15px 0px;  padding-left: 20px; padding-right: 20px; border-top: #ddd 1px solid; border-right: #ddd 1px solid; padding-top: 20px;">
                    ${COMMENT}
                </div>
                <p>此邮件由评论服务自动发出，直接回复无效！</p>
                <p>
                    <br>
                </p>
                <div class="chakan" style="text-align: center;">
                    <a href="${POST_URL}" style="color:#ffffff;text-decoration:none;display:inline-block;min-height:28px;line-height:28px;padding:0 13px;outline:0;background:#3eae5f;font-size:13px;text-align: center;font-weight:400;border:0;border-radius:999em" target="_blank">点击去原文查看&gt;&gt;</a>
                </div>
                <div class="footer-p" style="text-align: center; margin-top: 5rem; display:block;color:#b3b3b1;text-decoration:none;">
                    <img src="https://meuicat.com/media/favicon.ico" style="width:1.8rem; margin:0 auto">&nbsp;
                    <hr style="width:165px;border:0;border-bottom:1px solid #e5e5e5;margin:5px auto;">©&nbsp;2021 - 2023&nbsp;
                    <a href="https:/meuicat.com/" style="text-align:center; color: #0da1e6a6" target="_blank">MeuiCat</a>
                </div>
            </div>
        </div>
    </div>
    <style type="text/css">
        .qmbox::-webkit-scrollbar {
            display: none;
        }
        .qmbox #divNeteaseBigAttach,
        .qmbox #divNeteaseBigAttach_bak {
            display: none;
        }
        .qmbox blockquote {
            display: none;
        }
        .qmbox body {
            font-size: 14px;
            font-family: arial, verdana, sans-serif;
            line-height: 1.666;
            padding: 0;
            margin: 0;
            overflow: auto;
            white-space: normal;
            word-wrap: break-word;
            min-height: 100px;
        }
        .qmbox td,
        .qmbox input,
        .qmbox button,
        .qmbox select,
        .qmbox body {
            font-family: Helvetica, 'Microsoft Yahei', verdana;
        }
        .qmbox pre {
            white-space: pre-wrap;
            white-space: -moz-pre-wrap;
            white-space: -pre-wrap;
            white-space: -o-pre-wrap;
            word-wrap: break-word;
            width: 95%;
        }
        .qmbox th,
        .qmbox td {
            font-family: arial, verdana, sans-serif;
            line-height: 1.666;
        }
        .qmbox img {
            border: 0;
        }
        .qmbox header,
        .qmbox footer,
        .qmbox section,
        .qmbox aside,
        .qmbox article,
        .qmbox nav,
        .qmbox hgroup,
        .qmbox figure,
        .qmbox figcaption {
            display: block;
        }
        .qmbox blockquote {
            margin-right: 0px;
        }
        .qmbox a,
        .qmbox td a {
            color: #236da1;
        }
        @media screen and (max-width: 1100px) {
            #content p {
                font-size: 10px;
            }
            #content h3 {
                font-size: 14px;
            }
            .footer-p {
                font-size: 9px;
            }
            .dear {
                font-size: 12px;
            }
        }
    </style>
</div>

样式三

效果预览

访客端PE样式
访客端PC样式
博主端PE样式
博主端PC样式

样式代码

访客模版 MAIL_TEMPLATE

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
<div>
    <div style="border-radius:5px;font-size:13px;width:680px;margin:30px auto 0;max-width:100%">
        <div style="box-shadow:0 0 30px 0 rgb(219 216 214);border-radius:5px;width:630px;margin:auto;max-width:100%;margin-bottom:-30px">
            <div style="width:200px;height:40px;margin-top:-20px;margin-left:0;text-align:center;line-height:40px;text-decoration:none;color:#fff;background-color:#94a9b9;border-radius:5px 0">
                Dear: ${PARENT_NICK}
            </div>
            <div style="line-height:180%;padding:0 15px 12px;margin:30px auto;color:#555;font-size:12px;margin-bottom:0">
                <h2 style="border-bottom:1px solid #ddd;font-size:14px;font-weight:400;padding:13px 0 10px 8px">
                    <span style=color:#de6561;font-weight:700>&gt;</span>
                    您在<a style=text-decoration:none;color:#12addb href=${SITE_URL} target=_blank>
                            ${SITE_NAME}
                        </a>
                    上的评论有了新的回复呐~
                </h2>
                <div style="padding:0 12px 0 12px;margin-top:18px">
                    <div class=Messages_box>
                        <p style=display:flex;justify-content:flex-end>您曾评论：</p>
                        <div class="ax_post_box-comments-single Messages-author" style=display:flex;justify-content:flex-end;margin-bottom:5px;margin-top:7px>
                            <div class=ax_post_box-comment-avatar style=width:auto;flex:none;order:2>
                                <img src=${PARENT_IMG} style=width:40px;height:40px;border-radius:5px>
                            </div>
                            <div class=ax_post_box-comment-text style=position:relative;margin-right:10px>
                                <span class=ax_post_box-comment-text-before style="width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-left:8px solid;border-left-color:#f4f4f4;border-right:0;border-right-color:transparent;right:-7px;left:auto;top:12px;position:absolute"></span>
                                <div class=ax_post_box-comment-text-inner style=max-width:506px;background-color:#f1f3fa;padding:10px;border-radius:9px;margin-bottom:3px>
                                    ${PARENT_COMMENT}
                                </div>
                            </div>
                        </div>
                        <p>
                            <strong>${NICK}</strong>
                             回复您：
                        </p>
                        <div class="ax_post_box-comments-single Messages-user" style=display:flex;margin-bottom:5px;margin-top:7px>
                            <div class=ax_post_box-comment-avatar style=width:auto;flex:none>
                                <img src=${IMG} style=width:40px;height:40px;border-radius:5px>
                            </div>
                            <div class=ax_post_box-comment-text style=position:relative;margin-left:10px>
                                <span class=ax_post_box-comment-text-before style="width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-right:8px solid;border-right-color:#f4f4f4;left:-7px;right:auto;top:12px;position:absolute"></span>
                                <div class=ax_post_box-comment-text-inner style=max-width:506px;background-color:#f1f3fa;padding:10px;border-radius:9px;margin-bottom:3px>
                                    ${COMMENT}
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div style=text-align:center;margin-right:66px>
                <a style="text-decoration:none;color:#fff;background-color:#94a9b9;padding:5px 20px;border-radius:4px;position:absolute;margin-top:10px" href=${POST_URL} target=_blank>查看</a>
            </div>
        </div>
        <div style="width:100%;height:345px;background-repeat:no-repeat;border-radius:5px 5px 0 0;background-image:url(https://s11.ax1x.com/2023/08/27/pPU9Br9.png);background-size:cover;background-position:50% 50%"></div>
        <div style=color:#8c8c8c;font-size:10px;width:100%;text-align:center;margin-top:20px>
            <p>本邮件为系统自动发送，请勿直接回复~</p>
        </div>
        <div style=color:#8c8c8c;font-size:10px;width:100%;text-align:center;margin-top:5px>
            <p>Copyright © 2021 - 2023 <a href="${SITE_URL}">${SITE_NAME}</a></p>
        </div>
    </div>
    <style>
        * {
            margin: 0;
            padding: 0
        }
        img {
            -webkit-user-drag: none;
            border-radius: 3px
        }
        ul,
        ol {
            margin-left: 1rem !important
        }
        .tk-owo-emotion {
            width: 35px;
            height: auto;
            max-width: 300px;
            max-height: 300px;
            vertical-align: middle
        }
        .ax_post_box-comment-text-inner p,
        .ax_post_box-comment-text-inner img {
            max-width: 506px !important
        }
    </style>
</div>

博主模版 MAIL_TEMPLATE_ADMIN

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<div>
    <div style="border-radius:5px;font-size:13px;width:680px;margin:0 auto;max-width:100%">
        <div style="box-shadow:0 0 30px 0 rgb(219 216 214);border-radius:5px;width:630px;margin:auto;max-width:100%;margin-bottom:-30px">
            <div style="line-height:180%;padding:0 15px 12px;margin:10px auto;color:#555;font-size:12px;margin-bottom:0">
                <h2 style="border-bottom:1px solid #ddd;font-size:14px;font-weight:400;padding:13px 0 10px 8px">
                    <span style=color:#de6561;font-weight:700>&gt; </span>
                    <a style=text-decoration:none;color:#12addb href=${SITE_URL} target=_blank>
                        ${SITE_NAME}
                    </a>
                     有新的评论了耶~
                </h2>
                <div style="padding:0 12px 0 12px;margin-top:18px">
                    <div class=Messages_box>
                        <p>
                            <strong>${NICK}</strong> 评论：
                        </p>
                        <div class="ax_post_box-comments-single Messages-user" style=display:flex;margin-bottom:5px;margin-top:10px>
                            <div class=ax_post_box-comment-avatar style=width:auto;flex:none>
                                <img src=${IMG} style=width:40px;height:40px;border-radius:5px>
                            </div>
                            <div class=ax_post_box-comment-text style=position:relative;margin-left:10px>
                                <span class=ax_post_box-comment-text-before style="width:0;height:0;border-top:8px solid transparent;border-bottom:8px solid transparent;border-right:8px solid;border-right-color:#f4f4f4;left:-7px;right:auto;top:12px;position:absolute"></span>
                                <div class=ax_post_box-comment-text-inner style=background-color:#f1f3fa;padding:10px;border-radius:9px;margin-bottom:3px;max-width:506px>
                                    ${COMMENT}
                                </div>
                            </div>
                        </div>
                    </div>
                    <p style="background-color:#f5f5f5;border:0 solid #ddd;padding:10px 15px;margin:18px 0">
                        IP：${IP}<br>邮箱：<a href=mailto:${MAIL}>${MAIL}</a><br>文章地址：${POST_URL}
                    </p>
                </div>
            </div>
            <div style=text-align:center;margin-right:66px>
                <a style="text-decoration:none;color:#fff;background-color:#94a9b9;padding:5px 20px;border-radius:4px;position:absolute;margin-top:10px" href=${POST_URL} target=_blank>查看</a>
            </div>
        </div>
        <div style="width:100%;height:345px;background-repeat:no-repeat;border-radius:5px 5px 0 0;background-image:url(https://s11.ax1x.com/2023/08/27/pPU9Br9.png);background-size:cover;background-position:50% 50%"></div>
        <div style=color:#8c8c8c;font-size:10px;width:100%;text-align:center;margin-top:20px>
            <p>Copyright © 2021 - 2023 <a href="${SITE_URL}">${SITE_NAME}</a></p>
        </div>
    </div>
    <style>
        * {
            margin: 0;
            padding: 0
        }
        a {
            text-decoration: none;
            color: #555;
        }
        img {
            -webkit-user-drag: none;
            border-radius: 3px
        }

        ul,
        ol {
            margin-left: 1rem !important
        }

        .tk-owo-emotion {
            width: 35px;
            height: auto;
            max-width: 300px;
            max-height: 300px;
            vertical-align: middle
        }

        .ax_post_box-comment-text-inner p,
        .ax_post_box-comment-text-inner img {
            max-width: 506px !important
        }
    </style>
</div>

样式四

效果预览

访客端PE样式
访客端PC样式
博主端PE样式
博主端PC样式

样式代码

访客模版 MAIL_TEMPLATE

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
<div style="position:relative;font-size:14px;height:auto;padding:15px 15px 10px 15px;z-index:1;zoom:1;line-height:1.7;">
    <div style="max-width: 600px;padding: 3rem 1rem 0;margin: auto;font-size: 14px;color: #444;">
        <div style="display: flex;height: 80px;align-items: flex-end;">
            <img style="border-radius: 25%;width: 80px;height: 80px;" src="${PARENT_IMG}">
            <div style="display: flex;flex-direction: column;justify-content: end;line-height: 1.7;margin-left: 1rem;">
                <span style="font-size: 18px;white-space: nowrap;">你好,『 
                    <span style="font-weight: bold;">${PARENT_NICK}</span>&nbsp;』</span>
                    <span style="color: #555;">您在本站的留言有新的回复。</span>
                </div>
        </div>
        <div style="margin-top:30px;">
            <div style="margin-bottom: 30px;">
                <span style="display: flex;align-items: center;">
                    ${NICK}
                    <span style="font-size: 12px;color: #888;margin-left: .5rem;">
                        回复说：
                    </span>
                </span>
                <div style="display: flex;flex-direction: column;max-width: 100%;margin-top:5px;background: rgb(243 244 246 / 60%)!important;padding: 0 1.5rem;border-radius: 5px 25px 25px 25px;width: fit-content;">
                    <p>
                        ${COMMENT}
                    </p>
                </div>
            </div>
        </div>
        <div>
            <a href="${POST_URL}" style="background: #36d1dc!important;background: -webkit-linear-gradient(45deg, rgb(54, 209, 220), rgb(91, 134, 229))!important;background: linear-gradient(45deg, rgb(54, 209, 220), rgb(91, 134, 229))!important;padding: .5rem 1rem;border-radius: 10px;margin-bottom: 1rem;box-shadow: 0 0 18px rgb(159 198 255);color: white;font-size: 16px;text-decoration: none;display: block;width: fit-content;"
            rel="noopener" target="_blank">
                查看详细内容
            </a>
            <p style="margin: 5px!important;color: #888;font-size: 12px;">
                此邮件由系统自动发出，请勿直接回复！
            </p>
            <a href="${SITE_URL}" style="margin: 5px;color: #888;font-size: 12px;text-decoration: none;" rel="noopener" target="_blank">
                MEUICAT.COM
            </a>
        </div>
    </div>
    <style type="text/css">
        .tk-owo-emotion {
            border-radius: 10px;
            max-width: 80px;
        }
    </style>
</div>

博主模版 MAIL_TEMPLATE_ADMIN

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
<div style="position:relative;font-size:14px;height:auto;padding:15px 15px 10px 15px;z-index:1;zoom:1;line-height:1.7;">
    <div style="max-width: 600px;padding: 3rem 1rem 0;margin: auto;font-size: 14px;color: #444;">
        <div style="display: flex;height: 80px;align-items: flex-end;">
            <img style="border-radius: 25%;width: 80px;height: 80px;" src="https://thirdqq.qlogo.cn/g?b=sdk&nk=2714344056&s=140">
            <div style="display: flex;flex-direction: column;justify-content: end;line-height: 1.7;margin-left: 1rem;">
                <span style="font-size: 18px;white-space: nowrap;">你好,『 
                    <span style="font-weight: bold;">${SITE_NAME}</span>&nbsp;』博主</span>
                    <span style="color: #555;">您的博客收到一条新回复！</span>
                </div>
        </div>
        <div style="margin-top:30px;">
            <div style="margin-bottom: 30px;display: grid;justify-content: end;justify-items: end;">
                <span style="display: flex;align-items: center;">
                    <span style="font-size: 12px;color: #888;margin-left: .5rem;">
                        评论者信息
                    </span>
                </span>
                <div style="display: flex;flex-direction: column;max-width: 100%;margin-top:5px;background: rgb(243 244 246 / 60%)!important;padding: 0 1.5rem;border-radius: 25px 5px 25px 25px;width: fit-content;">
                    <p>
                        IP：${IP}<br>邮箱地址：${MAIL}<br>文章地址：${POST_URL}
                    </p>
                </div>
            </div>
            <div style="margin-bottom: 30px;">
                <span style="display: flex;align-items: center;">
                    ${NICK}
                    <span style="font-size: 12px;color: #888;margin-left: .5rem;">
                        回复说：
                    </span>
                </span>
                <div style="display: flex;flex-direction: column;max-width: 100%;margin-top:5px;background: rgb(243 244 246 / 60%)!important;padding: 0 1.5rem;border-radius: 5px 25px 25px 25px;width: fit-content;">
                    <p>
                        ${COMMENT}
                    </p>
                </div>
            </div>
        </div>
        <div>
            <a href="${POST_URL}" style="background: #36d1dc!important;background: -webkit-linear-gradient(45deg, rgb(54, 209, 220), rgb(91, 134, 229))!important;background: linear-gradient(45deg, rgb(54, 209, 220), rgb(91, 134, 229))!important;padding: .5rem 1rem;border-radius: 10px;margin-bottom: 1rem;box-shadow: 0 0 18px rgb(159 198 255);color: white;font-size: 16px;text-decoration: none;display: block;width: fit-content;"
            rel="noopener" target="_blank">
                查看详细内容
            </a>
            <p style="margin: 5px!important;color: #888;font-size: 12px;">
                此邮件由系统自动发出，请勿直接回复！
            </p>
            <a href="${SITE_URL}" style="margin: 5px;color: #888;font-size: 12px;text-decoration: none;" rel="noopener" target="_blank">
                MEUICAT.COM
            </a>
        </div>
    </div>
    <style type="text/css">
        .tk-owo-emotion {
            border-radius: 10px;
            max-width: 80px;
        }
    </style>
</div>

样式五

效果预览

访客端PE样式
访客端PC样式
博主端PE样式
博主端PC样式

样式代码

访客模版 MAIL_TEMPLATE

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<div>
    <table width="100%" height="100%" style="min-width: 348px;" border="0" cellspacing="0" cellpadding="0" lang="en">
        <tbody>
            <tr height="32" style="height: 32px;"><td></td></tr>
            <tr align="center">
                <td>
                    <table border="0" cellspacing="0" cellpadding="0" style="padding-bottom: 20px; max-width: 516px; min-width: 220px;">
                        <tbody>
                            <tr>
                                <td width="8" style="width: 8px;"></td>
                                <td>
                                    <div style="border-style: solid; border-width: thin; border-color:#dadce0; border-radius: 8px; padding: 40px 20px;" align="center">
                                        <img src="https://s11.ax1x.com/2023/08/28/pPau9US.png" width="74" height="24" aria-hidden="true" style="margin-bottom: 16px;">
                                        <div style="font-family: 'Google Sans',Roboto,RobotoDraft,Helvetica,Arial,sans-serif;border-bottom: thin solid #dadce0; color: rgba(0,0,0,0.87); line-height: 32px; padding-bottom: 24px;text-align: center; word-break: break-word;">
                                            <div style="font-size: 24px;">
                                                您的评论有新的回复
                                            </div>
                                        </div>
                                        <div style="font-family: Roboto-Regular,Helvetica,Arial,sans-serif; font-size: 14px; color: rgba(0,0,0,0.87); line-height: 20px;padding-top: 20px; text-align: left;">
                                            ${NICK}
                                            <span style="color: #888;margin-left: .5rem;">
                                                回复说：
                                            </span>
                                            ${COMMENT}
                                            <div style="padding-top: 32px; text-align: center;">
                                                <a href="${POST_URL}" target="_blank" link-id="main-button-link" style="font-family: 'Google Sans',Roboto,RobotoDraft,Helvetica,Arial,sans-serif; line-height: 16px; color: #ffffff; font-weight: 400; text-decoration: none;font-size: 14px;display:inline-block;padding: 10px 24px;background-color: #D94235; border-radius: 5px; min-width: 90px;" rel="noopener">
                                                    查看详细
                                                </a>
                                            </div>
                                        </div>
                                        <div style="padding-top: 20px; font-size: 12px; line-height: 16px; color: #5f6368; letter-spacing: 0.3px; text-align: center">
                                            您也可以访问以下网址查看文章评论详情：<br>
                                            <a href="${POST_URL}" style="color: rgba(0, 0, 0, 0.87);text-decoration: inherit;">
                                                ${POST_URL}
                                            </a>
                                        </div>
                                    </div>
                                    <div style="text-align: left;">
                                        <div style="font-family: Roboto-Regular,Helvetica,Arial,sans-serif;color: rgba(0,0,0,0.54); font-size: 11px; line-height: 18px; padding-top: 12px; text-align: center;">
                                            <div>
                                                此邮件由系统自动发出，目的是告知您在本站的评论得到了新的回复，请勿在此直接回复！
                                            </div>
                                            <div style="direction: ltr;">
                                                Copyright © 2021 - 2023 
                                                <a href="${SITE_URL}" style="font-family: Roboto-Regular,Helvetica,Arial,sans-serif;color: rgba(0,0,0,0.54); font-size: 11px; line-height: 18px; padding-top: 12px; text-align: center;">
                                                    ${SITE_NAME}
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td width="8" style="width: 8px;"></td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
            <tr height="32" style="height: 32px;"><td></td></tr>
        </tbody>
    </table>
</div>

博主模版 MAIL_TEMPLATE_ADMIN

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
<div>
    <table width="100%" height="100%" style="min-width: 348px;" border="0" cellspacing="0" cellpadding="0" lang="en">
        <tbody>
            <tr height="32" style="height: 32px;"><td></td></tr>
            <tr align="center">
                <td>
                    <table border="0" cellspacing="0" cellpadding="0" style="padding-bottom: 20px; max-width: 516px; min-width: 220px;">
                        <tbody>
                            <tr>
                                <td width="8" style="width: 8px;"></td>
                                <td>
                                    <div style="border-style: solid; border-width: thin; border-color:#dadce0; border-radius: 8px; padding: 40px 20px;" align="center">
                                        <img src="https://s11.ax1x.com/2023/08/28/pPau9US.png" width="74" height="24" aria-hidden="true" style="margin-bottom: 16px;">
                                        <div style="font-family: 'Google Sans',Roboto,RobotoDraft,Helvetica,Arial,sans-serif;border-bottom: thin solid #dadce0; color: rgba(0,0,0,0.87); line-height: 32px; padding-bottom: 24px;text-align: center; word-break: break-word;">
                                            <div style="font-size: 24px;">
                                                您的博客收到一条新回复
                                            </div>
                                            <table align="center" style="margin-top:8px;">
                                                <tbody>
                                                    <tr style="line-height: normal;">
                                                        <td style="display: grid;justify-items: center;">
                                                            <span style="font-family: 'Google Sans',Roboto,RobotoDraft,Helvetica,Arial,sans-serif;color: rgba(0,0,0,0.87); font-size: 14px; line-height: 20px;">
                                                                ${NICK} | ${IP}
                                                            </span>
                                                            <span style="font-family: 'Google Sans',Roboto,RobotoDraft,Helvetica,Arial,sans-serif;color: rgba(0,0,0,0.87); font-size: 14px; line-height: 20px;">
                                                                ${MAIL}
                                                            </span>
                                                        </td>
                                                    </tr>
                                                </tbody>
                                            </table>
                                        </div>
                                        <div style="font-family: Roboto-Regular,Helvetica,Arial,sans-serif; font-size: 14px; color: rgba(0,0,0,0.87); line-height: 20px;padding-top: 20px; text-align: left;">
                                            <span style="color: #888;">
                                                回复说：
                                            </span>
                                            ${COMMENT}
                                            <div style="padding-top: 32px; text-align: center;">
                                                <a href="${POST_URL}" target="_blank" link-id="main-button-link" style="font-family: 'Google Sans',Roboto,RobotoDraft,Helvetica,Arial,sans-serif; line-height: 16px; color: #ffffff; font-weight: 400; text-decoration: none;font-size: 14px;display:inline-block;padding: 10px 24px;background-color: #D94235; border-radius: 5px; min-width: 90px;" rel="noopener">
                                                    查看详细
                                                </a>
                                            </div>
                                        </div>
                                        <div style="padding-top: 20px; font-size: 12px; line-height: 16px; color: #5f6368; letter-spacing: 0.3px; text-align: center">
                                            您也可以访问以下网址查看文章评论详情：<br>
                                            <a href="${POST_URL}" style="color: rgba(0, 0, 0, 0.87);text-decoration: inherit;">
                                                ${POST_URL}
                                            </a>
                                        </div>
                                    </div>
                                    <div style="text-align: left;">
                                        <div style="font-family: Roboto-Regular,Helvetica,Arial,sans-serif;color: rgba(0,0,0,0.54); font-size: 11px; line-height: 18px; padding-top: 12px; text-align: center;">
                                            <div>
                                                此邮件由系统自动发出，目的是告知您的站点有了新的回复，请勿在此直接回复！
                                            </div>
                                            <div style="direction: ltr;">
                                                Copyright © 2021 - 2023 
                                                <a href="${SITE_URL}" style="font-family: Roboto-Regular,Helvetica,Arial,sans-serif;color: rgba(0,0,0,0.54); font-size: 11px; line-height: 18px; padding-top: 12px; text-align: center;">
                                                    ${SITE_NAME}
                                                </a>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td width="8" style="width: 8px;"></td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
            <tr height="32" style="height: 32px;"><td></td></tr>
        </tbody>
    </table>
</div>

样式六

效果预览

访客端PE样式
访客端PC样式
博主端PE样式
博主端PC样式

样式代码

访客模版 MAIL_TEMPLATE

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<div>
    <table cellspacing="0" border="0" cellpadding="0" align="center" width="100%" bgcolor="transparent" style="border-collapse:separate;border-spacing:0;letter-spacing:0;max-width:580px">
        <tbody>
            <tr>
                <td>
                    <table width="100%" style="border-collapse:separate;border-spacing:0;table-layout:fixed">
                        <tbody>
                            <tr>
                                <td style="color:#000;line-height:1.6">
                                    <h1 style="font-size:28px;font-weight:700;margin:28px auto;text-align:center">
                                        新回复通知
                                    </h1>
                                    <div style="height:240px;background-color:#3274ff"></div>
                                    <div style="margin:-120px 4% 0;background-color:#fff;font-size:18px;padding:8%;box-shadow:0 0 0 1px rgb(0,85,255,.1),3px 3px 0 rgb(0,85,255,.1);font-size:14px">
                                        <div style="margin-bottom:8%">
                                            <div style="display:inline-block;width:80%">
                                                <span style="color:#666;display: flex;justify-content: flex-end">
                                                    ${PARENT_NICK}
                                                </span>
                                                <div style="background-color:#F5F7FA;border-radius:10px;border-top-right-radius:0;padding:5% 8%;text-align: end">
                                                    ${PARENT_COMMENT}
                                                </div>
                                            </div>
                                            <img src="${PARENT_IMG}" style="border-radius:50%;width:15%;display:inline-block;vertical-align:top;margin-left:2%">
                                        </div>
                                        <div style="margin-bottom:8%">
                                            <img src="${IMG}" style="border-radius:50%;width:15%;display:inline-block;vertical-align:top;margin-right:2%">
                                            <div style="display:inline-block;width:80%">
                                                <span style="color:#666">
                                                    ${NICK}
                                                </span>
                                                <div style="background-color:#3274ff;color:#fff;border-radius:10px;border-top-left-radius:0;padding:5% 8%">
                                                    ${COMMENT}
                                                </div>
                                            </div>
                                        </div>
                                        <div style="border-top:1px dashed #ddd;text-align:center">
                                            <a target="_blank" href="${POST_URL}" style="background-color:#3274ff;border:none;color:#fff!important;margin:8% auto 0;padding:3% 10%;display:inline-block;text-decoration:none;border-radius: 6px" rel="noopener">
                                                立即回复
                                            </a>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
    </table>
    <table width="100%" align="center" style="border-collapse:separate;border-spacing:0;padding:5% 0;table-layout:fixed;text-align:center">
        <tbody>
            <tr>
                <td style="font-size:12px;padding:0">
                    <table cellspacing="0" border="0" cellpadding="0" align="center" width="100%" bgcolor="transparent" style="border-collapse:separate;border-spacing:0;letter-spacing:0;max-width:580px">
                        <tbody>
                            <tr>
                                <td valign="top" align="center" style="font-size:12px;color:#aaa">
                                    <div>
                                        <p>这是由系统自动发送的电子邮件，请勿在此直接回复！</p>
                                        <p>
                                            © 2021 - 2023 
                                            <a href="${SITE_URL}" style="color:#aaa" target="_blank" rel="noopener">
                                                ${SITE_NAME}
                                            </a>
                                        </p>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
    </table>
</div>

博主模版 MAIL_TEMPLATE_ADMIN

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
<div>
    <table cellspacing="0" border="0" cellpadding="0" align="center" width="100%" bgcolor="transparent" style="border-collapse:separate;border-spacing:0;letter-spacing:0;max-width:580px">
        <tbody>
            <tr>
                <td>
                    <table width="100%" style="border-collapse:separate;border-spacing:0;table-layout:fixed">
                        <tbody>
                            <tr>
                                <td style="color:#000;line-height:1.6">
                                    <h1 style="font-size:28px;font-weight:700;margin:28px auto;text-align:center">
                                        博客有新的回复
                                    </h1>
                                    <div style="height:240px;background-color:#3274ff"></div>
                                    <div style="margin:-120px 4% 0;background-color:#fff;font-size:18px;padding:8%;box-shadow:0 0 0 1px rgb(0,85,255,.1),3px 3px 0 rgb(0,85,255,.1);font-size:14px">
                                        <div style="margin-bottom:8%">
                                            <div style="display:inline-block;width:100%">
                                                <div style="background-color:#F5F7FA;border-radius:10px;padding:5% 8%;display: flex;justify-content: center">
                                                    <span style="text-align: center">评论者IP：${IP}<br>评论者邮箱：${MAIL}<br>文章地址：${POST_URL}</span>
                                                </div>
                                            </div>
                                        </div>
                                        <div style="margin-bottom:8%">
                                            <img src="${IMG}" style="border-radius:50%;width:15%;display:inline-block;vertical-align:top;margin-right:2%">
                                            <div style="display:inline-block;width:80%">
                                                <span style="color:#666">
                                                    ${NICK}
                                                </span>
                                                <div style="background-color:#3274ff;color:#fff;border-radius:10px;border-top-left-radius:0;padding:5% 8%">
                                                    ${COMMENT}
                                                </div>
                                            </div>
                                        </div>
                                        <div style="border-top:1px dashed #ddd;text-align:center">
                                            <a target="_blank" href="${POST_URL}" style="background-color:#3274ff;border:none;color:#fff!important;margin:8% auto 0;padding:3% 10%;display:inline-block;text-decoration:none;border-radius: 6px" rel="noopener">
                                                立即回复
                                            </a>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
    </table>
    <table width="100%" align="center" style="border-collapse:separate;border-spacing:0;padding:5% 0;table-layout:fixed;text-align:center">
        <tbody>
            <tr>
                <td style="font-size:12px;padding:0">
                    <table cellspacing="0" border="0" cellpadding="0" align="center" width="100%" bgcolor="transparent" style="border-collapse:separate;border-spacing:0;letter-spacing:0;max-width:580px">
                        <tbody>
                            <tr>
                                <td valign="top" align="center" style="font-size:12px;color:#aaa">
                                    <div>
                                        <p>这是由系统自动发送的电子邮件，请勿在此直接回复！</p>
                                        <p>
                                            © 2021 - 2023 
                                            <a href="${SITE_URL}" style="color:#aaa" target="_blank" rel="noopener">
                                                ${SITE_NAME}
                                            </a>
                                        </p>
                                    </div>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
    </table>
</div>

样式七

效果预览

访客端PE样式
访客端PC样式
博主端PE样式
博主端PC样式

样式代码

访客模版 MAIL_TEMPLATE

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
<div>
    <table bgcolor="#ffffff" width="100%" style="background-color:#ffffff" border="0" cellpadding="0" cellspacing="0">
        <tbody>
            <tr>
                <td>
                    <table width="700" align="center" border="0" cellpadding="0" cellspacing="0">
                        <tbody>
                            <tr>
                                <td>
                                    <table border="0" cellpadding="0" cellspacing="0" width="100%" bgcolor="#F5F8FC" style="background-color:#F5F8FC;font-family: 'Microsoft Yahei','PingFang SC', 'Source Han Sans CN'">
                                        <tbody>
                                            <tr>
                                                <td align="center" style="font-size:0;padding-left: 28px;padding-right:28px;padding-top: 28px;">
                                                    <img width="644" src="https://s11.ax1x.com/2023/08/28/pPaY9L4.jpg">
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    <table border="0" cellpadding="0" bgcolor="#f5f8fc" cellspacing="0" width="100%">
                                        <tbody>
                                            <tr>
                                                <td style="padding-left:28px;padding-right:28px;padding-bottom:28px;">
                                                    <table border="0" cellpadding="0" bgcolor="#ffffff" cellspacing="0" width="100%" style="border-spacing: 0;font-family: 'PingFang SC','Microsoft Yahei','Source Han Sans CN'">
                                                        <tbody>
                                                            <tr>
                                                                <td style="padding-top:46px;padding-right:28px;padding-bottom:40px;padding-left:28px;">
                                                                    <table border="0" cellpadding="0" cellspacing="0" width="100%" style="table-layout: fixed;line-height: 1;font-weight: bold;">
                                                                        <tbody>
                                                                            <tr>
                                                                                <td valign="top" style="width: 100%;">
                                                                                    <table border="0" cellpadding="0" cellspacing="0" style="font-weight: bold;display: flex;justify-content: center;">
                                                                                        <tbody>
                                                                                            <tr>
                                                                                                <td valign="top" style="text-align: left;color:#282B2D;font-size:26px;">
                                                                                                    <a style="text-decoration: none;color:#282B2D;" target="_blank" href="${POST_URL}" rel="noopener">
                                                                                                        《${SITE_NAME}》
                                                                                                    </a>
                                                                                                    中您曾评论：
                                                                                                </td>
                                                                                            </tr>
                                                                                        </tbody>
                                                                                    </table>
                                                                                </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                    <table border="0" cellpadding="0" cellspacing="0" style="line-height:1;display: flex;justify-content: center;">
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="padding-top:22px;padding-bottom:40px;">
                                                                                    <table border="0" cellpadding="0" cellspacing="0" style="table-layout: fixed;color:#666666;">
                                                                                        <tbody>
                                                                                            <tr>
                                                                                                <td style="font-size:26px;">
                                                                                                    <span style="text-decoration: none;font-size:18px;color:#666666;">
                                                                                                        ${PARENT_COMMENT}
                                                                                                    </span>
                                                                                                </td>
                                                                                            </tr>
                                                                                        </tbody>
                                                                                    </table>
                                                                                </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                    <table width="100%" style="line-height: 1;border-spacing: 0;">
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="padding:24px 20px 24px 20px;background: #F5F8FC;border: 1px solid #F0F0F0;">
                                                                                    <table width="100%" cellspacing="0" cellpadding="0">
                                                                                        <tbody>
                                                                                            <tr>
                                                                                                <td width="76" height="76">
                                                                                                    <img width="76" style="display: block; max-width: 100%; max-height:100%;" src="https://s11.ax1x.com/2023/08/28/pPaYpyF.png">
                                                                                                </td>
                                                                                                <td>
                                                                                                    <table cellspacing="0" cellpadding="0" style="line-height: 38px;border-spacing: 0;">
                                                                                                        <tbody>
                                                                                                            <tr>
                                                                                                                <td align="left" style="padding-left: 16px;color:#666666;font-size:20px;width: 450px;display:block;">
                                                                                                                    <span style="color:#666666;">
                                                                                                                        ${NICK} 回复说：
                                                                                                            </span>
                                                                                                                </td>
                                                                                                            </tr>
                                                                                                            <tr>
                                                                                                                <td align="left" style="padding-left: 16px;color:#282B2D;font-size:22px;width: 450px;display:block;">
                                                                                                                    <span style="text-decoration: none;color:#282B2D;">
                                                                                                                        ${COMMENT}
                                                                                                                    </span>
                                                                                                                </td>
                                                                                                            </tr>
                                                                                                        </tbody>
                                                                                                    </table>
                                                                                                </td>
                                                                                            </tr>
                                                                                        </tbody>
                                                                                    </table>
                                                                                </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <table width="100%" style="line-height: 1;border-spacing: 0;">
                                                        <tbody>
                                                            <tr>
                                                                <td>
                                                                    <table width="100%" style="border-spacing: 0;">
                                                                        <tbody>
                                                                            <tr>
                                                                                <td
                                                                                    style="background:#2475E7;height:88px;color:white;font-size:30px;text-align:center;">
                                                                                    <a style="text-decoration: none;color:white;" target="_blank" href="${POST_URL}" rel="noopener">
                                                                                        <span width="642" height="90">查看详情</span>
                                                                                    </a>
                                                                                </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
    </table>
    <div style="text-align:center;margin: 1.25rem 0;">
        这是由系统自动发送的电子邮件，请勿在此直接回复！
    </div>
</div>

博主模版 MAIL_TEMPLATE_ADMIN

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
<div>
    <table bgcolor="#ffffff" width="100%" style="background-color:#ffffff" border="0" cellpadding="0" cellspacing="0">
        <tbody>
            <tr>
                <td>
                    <table width="700" align="center" border="0" cellpadding="0" cellspacing="0">
                        <tbody>
                            <tr>
                                <td>
                                    <table border="0" cellpadding="0" cellspacing="0" width="100%" bgcolor="#F5F8FC" style="background-color:#F5F8FC;font-family: 'Microsoft Yahei','PingFang SC', 'Source Han Sans CN'">
                                        <tbody>
                                            <tr>
                                                <td align="center" style="font-size:0;padding-left: 28px;padding-right:28px;padding-top: 28px;">
                                                    <img width="644" src="https://s11.ax1x.com/2023/08/28/pPaY9L4.jpg">
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                    <table border="0" cellpadding="0" bgcolor="#f5f8fc" cellspacing="0" width="100%">
                                        <tbody>
                                            <tr>
                                                <td style="padding-left:28px;padding-right:28px;padding-bottom:28px;">
                                                    <table border="0" cellpadding="0" bgcolor="#ffffff" cellspacing="0" width="100%" style="border-spacing: 0;font-family: 'PingFang SC','Microsoft Yahei','Source Han Sans CN'">
                                                        <tbody>
                                                            <tr>
                                                                <td style="padding-top:46px;padding-right:28px;padding-bottom:40px;padding-left:28px;">
                                                                    <table border="0" cellpadding="0" cellspacing="0" width="100%" style="table-layout: fixed;line-height: 1;font-weight: bold;">
                                                                        <tbody>
                                                                            <tr>
                                                                                <td valign="top" style="width: 100%;">
                                                                                    <table border="0" cellpadding="0" cellspacing="0" style="font-weight: bold;display: flex;justify-content: center;">
                                                                                        <tbody>
                                                                                            <tr>
                                                                                                <td valign="top" style="text-align: left;color:#282B2D;font-size:26px;">
                                                                                                    您的博客有了新的回复！
                                                                                                </td>
                                                                                            </tr>
                                                                                        </tbody>
                                                                                    </table>
                                                                                </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                    <table border="0" cellpadding="0" cellspacing="0" style="line-height:1;display: flex;justify-content: center;">
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="padding-top:22px;padding-bottom:40px;">
                                                                                    <table border="0" cellpadding="0" cellspacing="0" style="table-layout: fixed;color:#666666;">
                                                                                        <tbody>
                                                                                            <tr>
                                                                                                <td style="display: grid;justify-items: center;">
                                                                                                    <span style="font-size:18px;color:#666666;">
                                                                                                        ${IP} · ${MAIL}
                                                                                                    </span>
                                                                                                    <span style="font-size:18px;color:#666666;">
                                                                                                        ${POST_URL}
                                                                                                    </span>
                                                                                                </td>
                                                                                            </tr>
                                                                                        </tbody>
                                                                                    </table>
                                                                                </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                    <table width="100%" style="line-height: 1;border-spacing: 0;">
                                                                        <tbody>
                                                                            <tr>
                                                                                <td style="padding:24px 20px 24px 20px;background: #F5F8FC;border: 1px solid #F0F0F0;">
                                                                                    <table width="100%" cellspacing="0" cellpadding="0">
                                                                                        <tbody>
                                                                                            <tr>
                                                                                                <td width="76" height="76">
                                                                                                    <img width="76" style="display: block; max-width: 100%; max-height:100%;" src="https://s11.ax1x.com/2023/08/28/pPaYpyF.png">
                                                                                                </td>
                                                                                                <td>
                                                                                                    <table cellspacing="0" cellpadding="0" style="line-height: 38px;border-spacing: 0;">
                                                                                                        <tbody>
                                                                                                            <tr>
                                                                                                                <td align="left" style="padding-left: 16px;color:#666666;font-size:20px;width: 450px;display:block;">
                                                                                                                    <span style="color:#666666;">
                                                                                                                        ${NICK} 回复说：
                                                                                                            </span>
                                                                                                                </td>
                                                                                                            </tr>
                                                                                                            <tr>
                                                                                                                <td align="left" style="padding-left: 16px;color:#282B2D;font-size:22px;width: 450px;display:block;">
                                                                                                                    <span style="text-decoration: none;color:#282B2D;">
                                                                                                                        ${COMMENT}
                                                                                                                    </span>
                                                                                                                </td>
                                                                                                            </tr>
                                                                                                        </tbody>
                                                                                                    </table>
                                                                                                </td>
                                                                                            </tr>
                                                                                        </tbody>
                                                                                    </table>
                                                                                </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                    <table width="100%" style="line-height: 1;border-spacing: 0;">
                                                        <tbody>
                                                            <tr>
                                                                <td>
                                                                    <table width="100%" style="border-spacing: 0;">
                                                                        <tbody>
                                                                            <tr>
                                                                                <td
                                                                                    style="background:#2475E7;height:88px;color:white;font-size:30px;text-align:center;">
                                                                                    <a style="text-decoration: none;color:white;" target="_blank" href="${POST_URL}" rel="noopener">
                                                                                        <span width="642" height="90">查看详情</span>
                                                                                    </a>
                                                                                </td>
                                                                            </tr>
                                                                        </tbody>
                                                                    </table>
                                                                </td>
                                                            </tr>
                                                        </tbody>
                                                    </table>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
    </table>
    <div style="text-align:center;margin: 1.25rem 0;">
        这是由系统自动发送的电子邮件，请勿在此直接回复！
    </div>
</div>