WordPress 默认的评论表情比较单一,或者有些主题已经将其屏蔽,那么,如果能给自己心爱的Blog换上常用的QQ表情,就会增色很多。网上有很多攻略,比如,使用Custom Smilies SE 插件,修改CSS代码等。但是这些不仅操作复杂,而且使用过多的插件还会影响访问速度,得不偿失了。

本文介绍一种比较简单实用的方法,直接加上QQ表情。

第一步,复制下面的代码,并命名为 smiley.php,(点开下面的 show source,展开代码)
[css collapse=”true”]
<script type="text/javascript" language="javascript">
/* <![CDATA[ */
function grin(tag) {
var myField;
tag = ‘ ‘ + tag + ‘ ‘;
if (document.getElementById(‘comment’) && document.getElementById(‘comment’).type == ‘textarea’) {
myField = document.getElementById(‘comment’);
} else {
return false;
}
if (document.selection) {
myField.focus();
sel = document.selection.createRange();
sel.text = tag;
myField.focus();
}
else if (myField.selectionStart || myField.selectionStart == ‘0’) {
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
var cursorPos = endPos;
myField.value = myField.value.substring(0, startPos)
+ tag
+ myField.value.substring(endPos, myField.value.length);
cursorPos += tag.length;
myField.focus();
myField.selectionStart = cursorPos;
myField.selectionEnd = cursorPos;
}
else {
myField.value += tag;
myField.focus();
}
}
/* ]]> */
</script>
<div id="smilelink">
<a onclick="javascript:grin(‘:?:’)"><img src="/wp-includes/images/smilies/icon_question.gif" title="汗" alt="哭" /></a>
<a onclick="javascript:grin(‘:razz:’)"><img src="/wp-includes/images/smilies/icon_razz.gif" title="色" alt="哭" /></a>
<a onclick="javascript:grin(‘:sad:’)"><img src="/wp-includes/images/smilies/icon_sad.gif" title="悲" alt="哭" /></a>
<a onclick="javascript:grin(‘:evil:’)"><img src="/wp-includes/images/smilies/icon_evil.gif" title="闭嘴" alt="哭" /></a>
<a onclick="javascript:grin(‘:!:’)"><img src="/wp-includes/images/smilies/icon_exclaim.gif" title="调皮" alt="哭" /></a>
<a onclick="javascript:grin(‘:smile:’)"><img src="/wp-includes/images/smilies/icon_smile.gif" title="笑" alt="哭" /></a>
<a onclick="javascript:grin(‘:oops:’)"><img src="/wp-includes/images/smilies/icon_redface.gif" title="惊" alt="哭" /></a>
<a onclick="javascript:grin(‘:grin:’)"><img src="/wp-includes/images/smilies/icon_biggrin.gif" title="亲" alt="哭" /></a>
<a onclick="javascript:grin(‘:eek:’)"><img src="/wp-includes/images/smilies/icon_surprised.gif" title="雷" alt="哭" /></a>
<a onclick="javascript:grin(‘:shock:’)"><img src="/wp-includes/images/smilies/icon_eek.gif" title="馋" alt="哭" /></a>
<a onclick="javascript:grin(‘:???:’)"><img src="/wp-includes/images/smilies/icon_confused.gif" title="晕" alt="哭" /></a>
<a onclick="javascript:grin(‘:cool:’)"><img src="/wp-includes/images/smilies/icon_cool.gif" title="酷" alt="哭" /></a>
<a onclick="javascript:grin(‘:lol:’)"><img src="/wp-includes/images/smilies/icon_lol.gif" title="奸" alt="哭" /></a>
<a onclick="javascript:grin(‘:mad:’)"><img src="/wp-includes/images/smilies/icon_mad.gif" title="怒" alt="哭" /></a>
<a onclick="javascript:grin(‘:twisted:’)"><img src="/wp-includes/images/smilies/icon_twisted.gif" title="狂" alt="哭" /></a>
<a onclick="javascript:grin(‘:roll:’)"><img src="/wp-includes/images/smilies/icon_rolleyes.gif" title="萌" alt="哭" /></a>
<a onclick="javascript:grin(‘:wink:’)"><img src="/wp-includes/images/smilies/icon_wink.gif" title="吃" alt="哭" /></a>
<a onclick="javascript:grin(‘:idea:’)"><img src="/wp-includes/images/smilies/icon_idea.gif" title="贪" alt="哭" /></a>
<a onclick="javascript:grin(‘:arrow:’)"><img src="/wp-includes/images/smilies/icon_arrow.gif" title="囧" alt="哭" /></a>
<a onclick="javascript:grin(‘:neutral:’)"><img src="/wp-includes/images/smilies/icon_neutral.gif" title="羞" alt="哭" /></a>
<a onclick="javascript:grin(‘:cry:’)"><img src="/wp-includes/images/smilies/icon_cry.gif" title="哭" alt="哭" /></a>
<a onclick="javascript:grin(‘:mrgreen:’)"><img src="/wp-includes/images/smilies/icon_mrgreen.gif" title="嘿" alt="嘿" /></a>
</div>
[/css]

把此文件上传到你的主题文件夹下面。
但我弄上去后,图片的汉字解释出现的都是”?”,很别扭,所以蹩脚的翻译了下,凑活着用吧,让大家见笑了。呵呵。
[css collapse=”true”]
<script type="text/javascript" language="javascript">
/* <![CDATA[ */
function grin(tag) {
var myField;
tag = ‘ ‘ + tag + ‘ ‘;
if (document.getElementById(‘comment’) && document.getElementById(‘comment’).type == ‘textarea’) {
myField = document.getElementById(‘comment’);
} else {
return false;
}
if (document.selection) {
myField.focus();
sel = document.selection.createRange();
sel.text = tag;
myField.focus();
}
else if (myField.selectionStart || myField.selectionStart == ‘0’) {
var startPos = myField.selectionStart;
var endPos = myField.selectionEnd;
var cursorPos = endPos;
myField.value = myField.value.substring(0, startPos)
+ tag
+ myField.value.substring(endPos, myField.value.length);
cursorPos += tag.length;
myField.focus();
myField.selectionStart = cursorPos;
myField.selectionEnd = cursorPos;
}
else {
myField.value += tag;
myField.focus();
}
}
/* ]]> */
</script>
<div id="smilelink">
<a onclick="javascript:grin(‘:question:’)"><img src="/wp-includes/images/smilies/icon_question.gif" title="Question" alt="C" /></a>
<a onclick="javascript:grin(‘:naughty:’)"><img src="/wp-includes/images/smilies/icon_razz.gif" title="Naughty" alt="C" /></a>
<a onclick="javascript:grin(‘:sad:’)"><img src="/wp-includes/images/smilies/icon_sad.gif" title="Sad" alt="C" /></a>
<a onclick="javascript:grin(‘:exclaim:’)"><img src="/wp-includes/images/smilies/icon_exclaim.gif" title="Exclaim" alt="C" /></a>
<a onclick="javascript:grin(‘:smile:’)"><img src="/wp-includes/images/smilies/icon_smile.gif" title="Smile" alt="C" /></a>
<a onclick="javascript:grin(‘:shy:’)"><img src="/wp-includes/images/smilies/icon_redface.gif" title="Shy" alt="C" /></a>
<a onclick="javascript:grin(‘:biggrin:’)"><img src="/wp-includes/images/smilies/icon_biggrin.gif" title="Biggrin" alt="C" /></a>
<a onclick="javascript:grin(‘:surprised:’)"><img src="/wp-includes/images/smilies/icon_surprised.gif" title="Surprised" alt="C" /></a>
<a onclick="javascript:grin(‘:eek:’)"><img src="/wp-includes/images/smilies/icon_eek.gif" title="Eek" alt="C" /></a>
<a onclick="javascript:grin(‘:confused:’)"><img src="/wp-includes/images/smilies/icon_confused.gif" title="Confused" alt="C" /></a>
<a onclick="javascript:grin(‘:cool:’)"><img src="/wp-includes/images/smilies/icon_cool.gif" title="Cool" alt="C" /></a>
<a onclick="javascript:grin(‘:sinister:’)"><img src="/wp-includes/images/smilies/icon_lol.gif" title="Sinister Smile" alt="C" /></a>
<a onclick="javascript:grin(‘:mad:’)"><img src="/wp-includes/images/smilies/icon_mad.gif" title="Mad" alt="C" /></a>
<a onclick="javascript:grin(‘:anger:’)"><img src="/wp-includes/images/smilies/icon_twisted.gif" title="Anger" alt="C" /></a>
<a onclick="javascript:grin(‘:rolleyes:’)"><img src="/wp-includes/images/smilies/icon_rolleyes.gif" title="Rolleyes" alt="C" /></a>
<a onclick="javascript:grin(‘:applaud:’)"><img src="/wp-includes/images/smilies/icon_wink.gif" title="Applaud" alt="C" /></a>
<a onclick="javascript:grin(‘:idea:’)"><img src="/wp-includes/images/smilies/icon_idea.gif" title="Idea" alt="C" /></a>
<a onclick="javascript:grin(‘:sweat:’)"><img src="/wp-includes/images/smilies/icon_arrow.gif" title="Sweat" alt="C" /></a>
<a onclick="javascript:grin(‘:doze:’)"><img src="/wp-includes/images/smilies/icon_neutral.gif" title="Doze" alt="C" /></a>
<a onclick="javascript:grin(‘:cry:’)"><img src="/wp-includes/images/smilies/icon_cry.gif" title="Cry" alt="C" /></a>
<a onclick="javascript:grin(‘:laugh:’)"><img src="/wp-includes/images/smilies/icon_mrgreen.gif" title="Laugh" alt="H" /></a>
</div>
[/css]

第二步,修改主题文件夹下面的 comments.php 文件,找到最后面的 textarea 那行,在上面加上
[php]
<?php include(TEMPLATEPATH . ‘/smiley.php’); ?>
[/php]

第三步,下载QQ表情文件。
网上提供了两种QQ表情下载,Round Face (常用QQ表情) 和 Square Face (方型表情)

Download: Round Face | Square Face

个人比较推荐 Round Face ,本站也使用的 Round Face 的QQ表情。大家可以根据自己的喜好下载。解压后复制到 /wp-includes/images/smilies 文件夹里,如果没有该文件夹,则先创建,如果已有,则覆盖默认的表情文件。

到此,大功告成!
当然,本站使用的是Inove模板。可能不同的主题设置会稍为不一样。

如果在后台升级过 WordPress ,那么在升级过程中,会初始化/wp-includes/images/smilies 里面的表情文件,所以,升级完成后,还得将 Round Face 的图片覆盖 /wp-includes/images/smilies 里面的初始表情。

—————————————————————————————————————————————————
补充部分:
如果觉得没必要放这么多表情,或者看某个表情不爽,可以将其删除,下面是简单步骤:
1、在 /wp-includes/images/smilies 文件夹中,将想要删除的表情图片删除;
2、在 主题目录下,修改 smiley.php 文件,删除相应的 a onclick……. 那行即可。如:
[php]
<a onclick="javascript:grin(‘:evil:’)"><img src="/wp-includes/images/smilies/icon_evil.gif" title="闭嘴" alt="哭" /></a>
[/php]

另外,如果安装上面的步骤操作完成后,还是得不到想要的效果,则需要先检查文件名和文件存放的地方对不对,然后看代码中的符号是全角还是半角(必须是英文状态下的符号),最后,如果做过什么修改,需要看看删除的代码是否有关联性。
如果自己检查完后,还是不行,可以在下面留言,或者重做一次,反正也不难,步骤也不多。 ^_^
—————————————————————————————————————————————————

========================================================
感谢西门的后花园我烧网 。本文转自多天网,并由 Edward Han 部分修改和添加。
========================================================