<font color=#27cf5e size=4>前言</font>


厌倦了评论表情?想来点不一样?你看对文章了,本篇文章将教大家如何轻轻松松给多少评论框增加颜文字的功能,突然有一个想把这个功能用在Typecho评论系统的想法。过段时间在研究吧……多说颜文字技术来源于香菇:很神奇的传送门;本次教程多说 css 来源于轻梦:很神奇的传送门

<font color=#27cf5e size=4>步骤</font>


第一步:附件下载:很神奇的传送门 (备用下载地址:很神奇的传送门

第二步:将默认引入的多说 js 改为附件中的 embed.min.js(可以储存到网站根目录之类的地方)

ds.src = (document.location.protocol == 'https:' ? 'https:' : 'http:') + '//static.duoshuo.com/embed.js';

修改为

ds.src = 'https://域名等/embed.min.js';

第三步:将附件的 duoshuo.css 里面的 css 填入多说自定义 css 中,(本地化加载大概也行,自行尝试)

第四步:引入附件中的 kaomoji.js 文件 [注意:多说颜文字需要引入 jq,kaomoji.js 需要在 jq 后面引入]

问题:如果出现排版错乱等问题,尝试切换多说的主题再次尝试。

颜文字表情框点击非表情框的位置消失: 在 kaomoji.js 后面加入下面的代码 (只对主评论框有效,回复时无效)

$(document).click(function (e) {
    var dragel = $(".ywz")[0],
        target = e.target;
    if (dragel !== target && !$.contains(dragel, target)) {
      $('#ymz').prop('class', 'ywz');
$('#biaoqing_box').prop('class', 'biaoqing_box');
    }
});

<font color=#27cf5e size=4>演示效果</font>


演示效果