首先下载表情包
主题目录/img/文件夹里面。
自定义表情替换函数
将下面的代码加入到functions.php里面，这段代码有两部分，看注释就明白了：
// 调用路径评论表情改造，使评论中显示表情。如需更换表情，img/smilies/下替换
add_filter ( 'smilies_src', 'inlojv_custom_smilies', 10, 2 );
function inlojv_custom_smilies($img_src, $img) {
return get_stylesheet_directory_uri () . '/img/smilies/' . $img;
}
//输出评论表情函数
function inlo_smilies(){
$a = array( 'mrgreen','razz','sad','smile','oops','grin','eek','???','cool','lol','mad','twisted','roll','wink','idea','arrow','neutral','cry','?','evil','shock','!' );
$b = array( 'mrgreen','razz','sad','smile','redface','biggrin','surprised','confused','cool','lol','mad','twisted','rolleyes','wink','idea','arrow','neutral','cry','question','evil','eek','exclaim' );
for( $i=0;$i<22;$i++ ){
echo '';
}
}
注意：输出的表情代码两旁是有空格的，也就是两个冒号左右各边都有空格，否则表情不显示。其中的inlo_smilies()函数就是输出表情用的，可以将它放入表情盒子。
点击显示/隐藏按钮和表情盒子
打开comments.php，添加一个表情显示/隐藏的点击按钮和表情盒子，一般放在textarea附近。html代码如下：
表情
其中comt-smilies就是表情盒子的class，注意先要用CSS控制它display:none，这里就不写了。然后用js控制它显示。
JS控制
用js控制显示/隐藏。还有表情a表情的点击事件(点击单个表情让它的代码显示在textarea区),看注释就明白了：
// 点击显示表情
$('body').on('click','.comt-addsmilies',
function(){
$('.comt-smilies').toggle();
});
// 点击评论textarea区后隐藏表情盒子
$('body').on('click','textarea',
function(){
$('.comt-smilies').hide();
});
// 点击表情在评论区插入表情代码
$('body').on('click','.comt-smilies a',
function() {
var ab = $(this).attr('href');// 抓取href内的值
var abc = ab.split('\'');// 按符号/来分割字符串为几个数组
var content = $('#comment').val(); // textarea区的id
content += abc[1];
$('#comment').val(content); // textarea区的id
});
最后说明
其实JS只需要控制表情盒子显示/隐藏即可，不用控制点击单个表情插入代码的，因为上面的inlo_smilies()函数里面的a标签的href值已经控制好了，但不知道为什么我用INLOUB主题点不出表情代码来，所以只能用js控制点击事件填入表情代码。
上面整个方法只是普通的添加表情方式，并没有采用load方法载入，所以为了减少表情图片的请求，可以用延迟加载。以上。
下面说说用load方法的步骤
基本和上面差不多，只不过load方法是用js控制将一个php文件插入到表情盒子的div里面所以上面的html代码中的
//输出评论表情函数
function inlo_smilies(){
$a = array( 'mrgreen','razz','sad','smile','oops','grin','eek','???','cool','lol','mad','twisted','roll','wink','idea','arrow','neutral','cry','?','evil','shock','!' );
$b = array( 'mrgreen','razz','sad','smile','redface','biggrin','surprised','confused','cool','lol','mad','twisted','rolleyes','wink','idea','arrow','neutral','cry','question','evil','eek','exclaim' );
for( $i=0;$i<22;$i++ ){
echo '';
}
}
// 执行该函数
inlo_smilies();
?>
要注意的是里面使用的是绝对路径，wp函数也不起作用，这个尚不清楚。写好之后js控制如下(其实可以参考开篇提到的那篇load方法去做就行了)
// 点击显示/隐藏评论表情
$('body').on('click','#comt_smilies',
function() {
$('#biaoqing').fadeToggle(100).css('display','inline-block');
$("#biaoqing").load('/wp-content/themes/inloub/bar/smiley.php'); // load方法将smiley.php插入到表情盒子中
});
以上！
