文章78
标签83
分类1

自用评论邮件通知美化模板

代码

WordPress:

<div style="background: white; width: 95%; max-width: 800px; margin: auto auto; border-radius: 5px; border:orange 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 style="width:100%;z-index: 666;" src="https://cdn.jsdelivr.net/gh/moezx/cdn@3.1.4/img/other/head.jpg">
    </header>
    <div style="padding: 5px 20px;">
        <p style="position: relative; color: white; float: left; z-index: 999; background: #91a5a5; padding: 5px 30px; margin: -25px auto 0 ; box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.30)">
            Dear ' . trim(get_comment($parent_id)->comment_author) . '
        </p>
        <br>
        <h3><span style="color: #12ADDB;font-weight: bold;">> </span>您有一条来自<a style="text-decoration: none;color: #12ADDB; " target="_blank" href="' .home_url(). '/">'. get_option("blogname") .'</a>的回复</h3>
        <br>
        <p style="font-size: 14px;">
            您在文章<a style="text-decoration:none;color: #12ADDB;" target="_blank" href="' . htmlspecialchars(get_comment_link($parent_id)) . '">《' . get_the_title($comment->comment_post_ID) . '》</a>上发表的评论:
        </p>
        <p style="border-bottom:#ddd 1px solid;border-left:#ddd 1px solid;padding-bottom:20px;background-color:#eee;border-radius:6px;margin:15px 0px;padding-left:20px;padding-right:20px;border-top:#ddd 1px solid;border-right:#ddd 1px solid;padding-top:20px">
            '
        . trim(get_comment($parent_id)->comment_content) . '
        </p>
        <p style="font-size: 14px;">
            ' . trim($comment->comment_author) . ' 给您的回复如下:
        </p>
        <p style="border-bottom:#ddd 1px solid;border-left:#ddd 1px solid;padding-bottom:20px;background-color:#eee;border-radius:6px;margin:15px 0px;padding-left:20px;padding-right:20px;border-top:#ddd 1px solid;border-right:#ddd 1px solid;padding-top:20px">
            '
        . trim($comment->comment_content) . '
        </p>
        <div style="text-align: center;">
            <a style="text-transform: uppercase; text-decoration: none; font-size: 14px; border: 2px solid #6c7575; color: #2f3333; border-radius:6px; padding: 10px; display: inline-block; margin: 10px auto 0; " target="_blank" href="' . htmlspecialchars(get_comment_link($parent_id)) . '">点击查看回复的完整內容</a>
        </div>
        <p style="font-size: 12px;text-align: center;color: #999;">
            本邮件为系统自动发出,请勿直接回复<br>
        © '.date(Y).' '.get_option("blogname").'
        </p>
    </div>
</div>

Typecho:

<div style="width: 550px;height: auto;border-radius: 5px;margin:0 auto;border:1px solid #ffb0b0;box-shadow: 0px 0px 20px #888888;position: relative;padding-bottom: 5px;">
    <div style="background-image: url(https://cdn.zrahh.com/img/mail.png);width:550px;height: 250px;background-size: cover;background-repeat: no-repeat;border-radius: 5px 5px 0px 0px;">
    </div>
    <div style="width: 200px;height: 40px;background-color: #91a5a5;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: {author_p}
    </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="border-bottom:1px solid #DDD;font-size:14px;font-weight:normal;padding:13px 0 10px 8px;"><span style="color: #12ADDB;font-weight: bold;">&gt; </span>您在<a style="text-decoration:none;color: #12ADDB;" href="{permalink}" target="_blank" rel="noopener noreferrer">《{title}》</a>的评论有了新的回复呐~</h2>
        <div style="padding:0 12px 0 12px;margin-top:18px">
            <p>
                时间:<span style="border-bottom:1px dashed #ccc;" t="5" times=" 20:42">{time}</span>
            </p>
            <p>
                您的评论:
            </p>
            <p style="background-color: #f5f5f5;border: 0px solid #DDD;padding: 10px 15px;margin:18px 0">
                {text_p}
            </p>
            <p>
                <strong>{author}</strong>&nbsp;给您的回复:
            </p>
            <p style="background-color: #f5f5f5;border: 0px solid #DDD;padding: 10px 15px;margin:18px 0">
                {text}
            </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:#91a5a5;height: 40px;line-height: 35px;box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.30);margin: -10px auto;display: block;" href="{permalink}" target="_blank" rel="noopener noreferrer">查看回复的完整內容</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>
            本邮件为系统自动发送,请勿直接回复~
        </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;">
        <p>
            ©2017-2019 Copyright {author}
        </p>
    </div>
</div>

如果如果你是Typecho且嫌麻烦,请下载此插件,里面已集成此评论模板guest.html点我下载)并参考给你的Typecho配置邮件通知评论功能-CommentToMail插件进行插件配置。

预览图

为你的网站添加Gittalk评论

Gitalk 是一个基于 GitHub Issue 和 Preact 开发的评论插件。项目地址:https://github.com/gitalk/gitalk

特性

  • 使用 GitHub 登录
  • 支持多语言 [en, zh-CN, zh-TW, es-ES, fr, ru]
  • 支持个人或组织
  • 无干扰模式(设置 distractionFreeMode 为 true 开启)
  • 快捷键提交评论 (cmd|ctrl + enter)

如何安装

<link rel="stylesheet" href="https://unpkg.com/gitalk/dist/gitalk.css">
<script src="https://unpkg.com/gitalk@latest/dist/gitalk.min.js">script>

<div id="gitalk-container">div><!--在需要调用的地方添加-->

    <script type="text/javascript">
    var gitalk = new Gitalk({

    // Gitalk的主要参数
        clientID: `Github Application clientID`,
        clientSecret: `Github Application clientSecret`,
        repo: `存储你评论 issue 的 Github 仓库名`,
        owner: 'Github 用户名',
        admin: ['Github 用户名'],
        id: location.pathname,      // Ensure uniqueness and length less than 50
        distractionFreeMode: false  // Facebook-like distraction free mode
})

gitalk.render('gitalk-container')
</script>

申请GitHub Application

安装Gittalk需要申请 GitHub Application,如果没有 点击这里申请Authorization callback URL填写当前使用插件页面的域名。下面的图片是博主翻译过的,你可以对照着图片填写,注意:主页地址和回调地址都填你网站首页地址即可。

点击注册后即可跳转到应用页面

把里面的Client IDClient Secret复制到上面Gitalk的主要参数里面即可。

到此大功告成

wordpress评论夜间自动改为必须审核

从龙大佬那搬来的 因为白天都醒着,而且手机有提醒,所以对于恶意评论可以做到秒删 但是晚上就不可以了 所以这个就必要使用了

/**
 * Wordpress控制评论状态的钩子:pre_comment_approved - 龙笑天下
 * https://www.ilxtx.com/wordpress-filter-pre-comment-approved.html
 * 实用方法:新增评论规则 -- 晚上23:30-9:00的评论全部设为待审核
 */
function lxtx_limit_comment_to_pending($approved, $commentdata){
    date_default_timezone_set('Asia/Shanghai'); //设置为东八区上海时间
    $time = time();
    $t1 = date("Y-m-d",$time).' 09:00:00';
    $t2 = date("Y-m-d",$time).' 23:30:00';    
    $short_t1 = strtotime($t1);
    $short_t2 = strtotime($t2);
    if( ($time>$short_t2 || $time<$short_t1) && !current_user_can('manage_options') ){
        $approved = 0;
    }
    return $approved;
}
add_action('pre_comment_approved', 'lxtx_limit_comment_to_pending', 10, 2);