sablog-x 2.0 表情功能BUG、hack留言插入表情和设置自定义表情
[b]bug描述：[/b]
[list=1]
[*]2.0编辑器插入表情插入的是相对地址，导致使用静态链接的用户无法在文章中正常显示表情
[*]1.6表情使用的是静态地址，当更换域名或者更换路径之后，表情无法正常显示问题，2.0的BUG或许就是为了解决这个，但是却忽略了静态地址问题。
[/list]
[b]功能缺陷：[/b]
[list=1]
[*]评论框不能添加表情。
[*]编辑器不能使用自定义表情
[/list]
[b]hack思路：[/b]
[list=1]
[*]修改fckeditor编辑器，实现添加表情的字标，然后由程序后台即时将表情字标转换成为图片链接。
[*]留言框添加插入表情功能
[/list]
[b]hack过程：[/b]
全过程需要修改11个文件，后面会一一讲述如何修改。
[b]首先是修改fckeditor编辑器[/b]
打开\include\editor\editor\js\fckeditorcode_ie.js，使用ctrl+f查找功能查找以下代码（在第42行）[code]var C=FCK.EditorDocument.createElement('IMG');C.className="Smile";C.src=A;C.alt=B;C.title=B;FCK.InsertElement(C); [/code]将以上代码替换为[code]FCK.InsertHtml('[face='+B+']');[/code]然后再打开\include\editor\editor\js\fckeditorcode_gecko.js，在第41行，找到和前面fckeditorcode_ie.js中一样的代码，并将其替换为：[code]FCK.InsertHtml('[face='+B+']'); [/code]编辑器修改完毕。
[b]然后修改输出文件[/b]
打开/modules/article.php文件，大约在244行左右，找到：[code]//处理PHP高亮 $article['content'] = preg_replace("/\s*\[php\](.+?)\[\/php\]\s*/ies", "phphighlite('\\1')", $article['content']);[/code]在这段代码下面添加上如下几行代码：（效果是将标准模式浏览界面下的表情字标转换为表情图片）[code] //处理表情 $article['content'] = preg_replace('/\[face=(\w*)\]/i','<img class=smile alt="\\1" src="'.$options[url].'images/smiles/\\1.gif" />', $article['content']); [/code]打开/modules/show.php文件，大约在142行左右，找到：[code] //处理PHP高亮 $article['content'] = preg_replace("/\s*\[php\](.+?)\[\/php\]\s*/ies", "phphighlite('\\1')", $article['content']); [/code]在其下面添加上如下几行代码：（效果是将显示文章的页面中的表情字标转换为表情图片）[code]//处理文章表情 $article['content'] = preg_replace('/\[face=(\w*)\]/i','<img class=smile alt="\\1" src="'.$options[url].'images/smiles/\\1.gif" />', $article['content']); [/code]还是show.php文件，继续往下，大约在232行左右，找到：[code]$comment['content'] = html_clean($comment['content']); [/code]将这行代码替换为：(效果是将显示文章页面下部的评论中的表情字标转换为表情图片)[code] //处理评论表情 $comment['content'] = preg_replace('/\[face=(\w*)\]/i','<img class=smile alt="[face=\\1]" src="'.$options[url].'images/smiles/\\1.gif" />', html_clean($comment['content'])); [/code]打开\modules\comments.php，大约在29行左右，找到：[code] $comment['content'] = html_clean($comment['content']);[/code]将这行代码替换为：（效果是将评论页面中的表情字标转换为表情图片）[code]//处理评论表情 $comment['content'] = preg_replace('/\[face=(\w*)\]/i','<img class=smile alt="[face=\\1]" src="'.$options[url].'images/smiles/\\1.gif" />', html_clean($comment['content'])); [/code]打开\include\func\cache.func.php文件，大约在154行，找到：[code]$newcomment['content'] = preg_replace("/\[quote=(.*?)\]\s*(.+?)\s*\[\/quote\]/is", "", $newcomment['content']); [/code]在其下方添加上一行代码：（效果，将侧边栏中的表情字标用表情的英文名替代输出，避免别人留言只留表情，而导致侧栏空白）[code]$newcomment['content'] = preg_replace('/\[face=(\w*)\]/i', "\\1 ", $newcomment['content']); [/code]打开\include\func\template.func.php文件，大约在64行那里（空白行），插入一个新的函数：[code]function addsmiles($var) { return str_replace("\\\"", "\"", preg_replace("/\[([a-zA-Z0-9_\-\.\x7f-\xff]+)\]/s", "['\\1']", $var)); } [/code]打开\include\jscript\show.js文件，大约在30行，找到：[code]text = text.replace(/alt\=(\"|)([^\"\s]*)(\"|)/g,"> $2 <"); text = text.replace(/\<[^\<\>]+\>/g,"\n"); [/code]将其替换为：（效果，修正在引用别人留言时，表情字标的传递和显示）[code]text = text.replace(/alt\=(\"|)([^\"\s]*)(\"|)/g,">$2<"); text = text.replace(/\<[^\<\>]+\>/g,""); [/code]然后继续在show.js代码中，移动到45行（应该是空白行），添加一个新函数：[code]function addsmiles(facename){ $("content").value += "[face="+facename+"]"; $("content").focus(); } [/code][b]最后是修改模板文件了[/b]
打开templates\你的模板文件夹\show.php文件，找到评论框位置，找到如下内容（相似也行）
评论内容 (必填):<br />
在其后面添加上：[code]<img style="cursor:pointer;" onclick="addsmiles('surprise')" src="$options[url]images/smiles/surprise.gif" /> <img alt="glade" style="cursor:pointer;" onclick="addsmiles('glade')" src="$options[url]images/smiles/glade.gif" /> <img alt="love" style="cursor:pointer;" onclick="addsmiles('love')" src="$options[url]images/smiles/love.gif" /> <img alt="cry" style="cursor:pointer;" onclick="addsmiles('cry')" src="$options[url]images/smiles/cry.gif" /> <img alt="sing" style="cursor:pointer;" onclick="addsmiles('sing')" src="$options[url]images/smiles/sing.gif" /> <img alt="fight" style="cursor:pointer;" onclick="addsmiles('fight')" src="$options[url]images/smiles/fight.gif" /> <img alt="bitter" style="cursor:pointer;" onclick="addsmiles('bitter')" src="$options[url]images/smiles/bitter.gif" /> <img alt="dream" style="cursor:pointer;" onclick="addsmiles('dream')" src="$options[url]images/smiles/dream.gif" /> <img alt="approve" style="cursor:pointer;" onclick="addsmiles('approve')" src="$options[url]images/smiles/approve.gif" /> <img alt="dissatisfy" style="cursor:pointer;" onclick="addsmiles('dissatisfy')" src="$options[url]images/smiles/dissatisfy.gif" /> <img alt="question" style="cursor:pointer;" onclick="addsmiles('question')" src="$options[url]images/smiles/question.gif" /> <img alt="plaint" style="cursor:pointer;" onclick="addsmiles('plaint')" src="$options[url]images/smiles/plaint.gif" /> <img alt="slaver" style="cursor:pointer;" onclick="addsmiles('slaver')" src="$options[url]images/smiles/slaver.gif" /> <img alt="incisor" style="cursor:pointer;" onclick="addsmiles('incisor')" src="$options[url]images/smiles/incisor.gif" /> <img alt="whistle" style="cursor:pointer;" onclick="addsmiles('whistle')" src="$options[url]images/smiles/whistle.gif" /> <img alt="pain" style="cursor:pointer;" onclick="addsmiles('pain')" src="$options[url]images/smiles/pain.gif" /> <img alt="feed" style="cursor:pointer;" onclick="addsmiles('feed')" src="$options[url]images/smiles/feed.gif" /> <img alt="esotropia" style="cursor:pointer;" onclick="addsmiles('esotropia')" src="$options[url]images/smiles/esotropia.gif" /> <img alt="faint" style="cursor:pointer;" onclick="addsmiles('faint')" src="$options[url]images/smiles/faint.gif" /> <img alt="innocent" style="cursor:pointer;" onclick="addsmiles('innocent')" src="$options[url]images/smiles/innocent.gif" />
<img alt="fuck" style="cursor:pointer;" onclick="addsmiles('fuck')" src="$options[url]images/smiles/fuck.gif" /> <img alt="young" style="cursor:pointer;" onclick="addsmiles('young')" src="$options[url]images/smiles/young.gif" /> <img alt="football" style="cursor:pointer;" onclick="addsmiles('football')" src="$options[url]images/smiles/football.gif" /> <img alt="dead" style="cursor:pointer;" onclick="addsmiles('dead')" src="$options[url]images/smiles/dead.gif" /> <img alt="terror" style="cursor:pointer;" onclick="addsmiles('terror')" src="$options[url]images/smiles/terror.gif" /> <img alt="none" style="cursor:pointer;" onclick="addsmiles('none')" src="$options[url]images/smiles/none.gif" /> <img alt="smile" style="cursor:pointer;" onclick="addsmiles('smile')" src="$options[url]images/smiles/smile.gif" /> <img alt="awkard" style="cursor:pointer;" onclick="addsmiles('awkard')" src="$options[url]images/smiles/awkard.gif" /> <img alt="frisk" style="cursor:pointer;" onclick="addsmiles('frisk')" src="$options[url]images/smiles/frisk.gif" /> <img alt="fire" style="cursor:pointer;" onclick="addsmiles('fire')" src="$options[url]images/smiles/fire.gif" /> <img alt="sick" style="cursor:pointer;" onclick="addsmiles('sick')" src="$options[url]images/smiles/sick.gif" /> <img alt="sinister" style="cursor:pointer;" onclick="addsmiles('sinister')" src="$options[url]images/smiles/sinister.gif" /> <img alt="sleep" style="cursor:pointer;" onclick="addsmiles('sleep')" src="$options[url]images/smiles/sleep.gif" /> <img alt="shutup" style="cursor:pointer;" onclick="addsmiles('shutup')" src="$options[url]images/smiles/shutup.gif" /> <img alt="tongue" style="cursor:pointer;" onclick="addsmiles('tongue')" src="$options[url]images/smiles/tongue.gif" /> <img alt="cool" style="cursor:pointer;" onclick="addsmiles('cool')" src="$options[url]images/smiles/cool.gif" /> <img alt="disch" style="cursor:pointer;" onclick="addsmiles('disch')" src="$options[url]images/smiles/disch.gif" /> <img alt="deride" style="cursor:pointer;" onclick="addsmiles('deride')" src="$options[url]images/smiles/deride.gif" /> <img alt="angry" style="cursor:pointer;" onclick="addsmiles('angry')" src="$options[url]images/smiles/angry.gif" /> <img alt="shy" style="cursor:pointer;" onclick="addsmiles('shy')" src="$options[url]images/smiles/shy.gif" />
[/code][b]修改RSS页面输出[/b]
打开\rss.php，找到大约150行的如下代码：[code]//处理PHP高亮 $article['content'] = preg_replace("/\s*\[php\](.+?)\[\/php\]\s*/ies", "phphighlite('\\1')", $article['content']); [/code]在这段代码后面插入：[code]//处理文章表情 $article['content'] = preg_replace('/\[face=(\w*)\]/i','<img class=smile alt="\\1" src="'.$options[url].'images/smiles/\\1.gif" />', $article['content']); [/code][b]修改WAP页面输出[/b]
打开\wap\index.php文件，找到587行，如下：[code]$article['content'] = html2text(str_replace(array('
','
'),'',$article['content'])); [/code]在这一行前面添加上：[code]//处理文章表情 $article['content'] = preg_replace('/\[face=(\w*)\]/i','<img class=smile alt="\\1" src="'.$options[url].'images/smiles/\\1.gif" />', $article['content']); [/code]完成这以上所有工作了，我们现在打开\include\editor\editor\images\smiles\文件夹，然后发现里面很多表情。然后我们打开\images\smiles\文件夹，先将这里面的表情备份到别处，然后将\include\editor\editor\images\smiles\这个里面的全部表情复制到\images\smiles\中，这样，所有表情就能够正常使用了。
如果需要自定义表情
需要自定义表情，请先将新表情肤知道\images\smiles\文件夹中，然后打开\include\editor\editor\fckconfig.js文件，拉到最后，找到FCKConfig.SmilesImages，将后面方括号中的表情文件名称按照原来的格式修改为新的表情的文件名，为了美观，也可以将表情框宽度"FCKConfig.SmilesPanelWidth = 200 ;"修改一下，最后就是修改模板文件中的show.php，将原来的图片按照格式换成新的图片，自定义表情就完成了。
PS.这篇文章总共重新修改了3遍，修改的文件太多，写的时候，就写漏了，现在的应该没有问题了。文末附上部分文件修改后的代码，解压缩后，直接覆盖即可。