闲着没事的时候，就想着怎么瞎折腾博客，下面是我在度娘里找到的方法，当然了，这个也要针对一些主题来修改的，不是所有主题都适合修改，也有一些主题早已经实现了这一功能。下面是我对我现在正在使用的weisaysimple主题进行的修改，大家可以进行参考。
把wordpress编辑器里默认表情进行隐藏，点击评论框便出现，再点击则再次隐藏，并添加颜色、图片等按钮增强编辑器。实现淡入淡出效果，关于淡入淡出的时间你也可以自行修改调整。
1、打开主题文件中的评论模板comments.php（大多主题都是这个文件，如果你的主题比较奇葩的话或许在其他地方，那就自己找吧）。
找到

把下面代码进行覆盖

其中上面的颜色代码可自行修改，请保持和JS文件进行同步修改，如果你的主题不支持哪种颜色自己去找喜欢的类型替换。
注意，在下面还要找到

把上一段代码删除，不然就会出现两个评论框了哦。
2、将下面的CSS代码添加到style.css文件中

3、将下面的jQuery代码添加到你的js文件中或者自己新建个js文件，不要忘记在头文件模板中引用哦
我的是调用到header.php顶部文件里面，调用代码是

下面是jQuery代码，由于下面的代码与代码高亮功能有所冲突，下面就用引用代码贴出，可以直接复制粘贴，不受影响。

//评论框编辑器
$(document).ready(function () {
$(“https://www.zhbk.name/467-3/smiley”).hide(500);
$(“https://www.zhbk.name/467-3/comment-smiley”).click(function(){
$(“https://www.zhbk.name/467-3/smiley”).toggle(500);
});
});
$(document).ready(function () {
$(“https://www.zhbk.name/467-3/fontcolor”).hide(500);
$(“https://www.zhbk.name/467-3/font-color”).click(function(){
$(“https://www.zhbk.name/467-3/fontcolor”).toggle(500);
});
});
$(document).ready(function () {
$(“https://www.zhbk.name/467-3/editor”).hide(500);
$(“https://www.zhbk.name/467-3/comment”).click(function(){
$(“https://www.zhbk.name/467-3/editor”).toggle(500);
});
});
$(document).ready(function () {
$(“https://www.zhbk.name/467-3/smiley”).toggle();
$(“https://www.zhbk.name/467-3/comment”).click(function(){
$(“https://www.zhbk.name/467-3/smiley”).hide(500);
});
});
$(document).ready(function () {
$(“https://www.zhbk.name/467-3/fontcolor”).toggle();
$(“https://www.zhbk.name/467-3/comment”).click(function(){
$(“https://www.zhbk.name/467-3/fontcolor”).hide(500);
});
});
$(document).ready(function () {
$(“https://www.zhbk.name/467-3/smiley”).hide();
$(“https://www.zhbk.name/467-3/comment”).click(function(){
});
});
$(document).ready(function () {
$(“https://www.zhbk.name/467-3/fontcolor”).hide();
$(“https://www.zhbk.name/467-3/comment”).click(function(){
});
});
$(function() {
function addEditor(a, b, c) {
if (document.selection) {
a.focus();
sel = document.selection.createRange();
c ? sel.text = b + sel.text + c: sel.text = b;
a.focus()
} else if (a.selectionStart || a.selectionStart == ‘0’) {
var d = a.selectionStart;
var e = a.selectionEnd;
var f = e;
c ? a.value = a.value.substring(0, d) + b + a.value.substring(d, e) + c + a.value.substring(e, a.value.length) : a.value = a.value.substring(0, d) + b + a.value.substring(e, a.value.length);
c ? f += b.length + c.length: f += b.length - e + d;
if (d == e && c) f -= c.length;
a.focus();
a.selectionStart = f;
a.selectionEnd = f
} else {
a.value += b + c;
a.focus()
}
}
var g = document.getElementById(‘comment’) || 0;
var h = {
strong: function() {
addEditor(g, ‘‘, ‘‘)
},
em: function() {
addEditor(g, ‘‘, ‘‘)
},
del: function() {
addEditor(g, ‘‘, ‘‘)
},
underline: function() {
addEditor(g, ‘‘, ‘‘)
},
quote: function() {
addEditor(g, ‘

‘, ‘

‘)
},
ahref: function() {
var a = prompt(‘请输入链接地址’, ‘https://’);
var b = prompt(‘请输入要显示成文字链接的描述’,”);
if (a) {
addEditor(g, ‘‘ + b + ‘‘,”)
}
},
img: function() {
var a = prompt(‘请输入图片地址’, ‘https://’);
if (a) {
addEditor(g, ‘‘,”)
}
},
code: function() {
addEditor(g, ‘

‘)
},
red: function() {
addEditor(g, ‘‘, ‘‘)
},
green: function() {
addEditor(g, ‘‘, ‘‘)
},
blue: function() {
addEditor(g, ‘‘, ‘‘)
},
magenta: function() {
addEditor(g, ‘‘, ‘‘)
},
yellow: function() {
addEditor(g, ‘‘, ‘‘)
},
chocolate: function() {
addEditor(g, ‘‘, ‘‘)
},
black: function() {
addEditor(g, ‘‘, ‘‘)
},
aquamarine: function() {
addEditor(g, ‘‘, ‘‘)
},
lime: function() {
addEditor(g, ‘‘, ‘‘)
},
fuchsia: function() {
addEditor(g, ‘‘, ‘‘)
},
orange: function() {
addEditor(g, ‘‘, ‘‘)
},
thistle: function() {
addEditor(g, ‘‘, ‘‘)
},
brown: function() {
addEditor(g, ‘‘, ‘‘)
},
peru: function() {
addEditor(g, ‘‘, ‘‘)
},
deeppink: function() {
addEditor(g, ‘‘, ‘‘)
},
purple: function() {
addEditor(g, ‘‘, ‘‘)
},
slategray: function() {
addEditor(g, ‘‘, ‘‘)
},
tomato: function() {
addEditor(g, ‘‘, ‘‘)
}
};
window[‘SIMPALED’] = {};
window[‘SIMPALED’][‘Editor’] = h
});

括号里的数字500是淡入淡出是时间500毫秒，可自行修改。其中的颜色可自行修改，请保持和comments.php文件中的编辑器进行同步修改。
到这里效果就出来了，当然如果你使用的是和我一样的主题，那么这里还要做一步，那就是留言模板那里好像还没有效果，
所以，我们在这里还要做最后一步，因为weisaysimple主题里面留言模板里调用的是gbook2.php文件，所以这里要在gbook2.php文件的顶部添加如下代码进行jQuery代码调用

PS：如上都是本人按照自己的主题进行修改的，如果要对你的博客进行修改，注意，要先备份好，再来折腾。
如果你是高手，就请直接PASS吧。

本文固定链接: https://www.zhbk.name/1-2/473-2/ | m88博客