http://shenzhoulong.blog.51cto.com/1191789/366058
添加表情的方法 :
FCKeditor默认给我们提供的图片,说实话,个人感觉真是丑的个无法形容。幸好,我们还可以修改这些丑的无法形容的表情,下面大家就跟着我做吧。
首先我们要下载我们喜欢的表情图片,我也懒的上网找,QQ的表情已经很丰富可爱了,我就用它来举例吧。我们到QQ安装目录下face文件夹中挑选出我们喜欢的表情图片,然后在项目的fckeditor/editor/images/smiley文件夹中新建一个文件夹,名为myface,将我们的QQ表情复制到myface文件夹中待用。
然后在fckconfig.js中找到下面代码:
FCKConfig.SmileyPath = FCKConfig.BasePath + 'images/smiley/msn/' ;/*表情图片路径,默认为msn文件夹,我们可以修改*/
FCKConfig.SmileyImages = ['regular_smile.gif','sad_smile.gif','wink_smile.gif','teeth_smile.gif','confused_smile.gif','tounge_smile.gif','embaressed_smile.gif','omg_smile.gif','whatchutalkingabout_smile.gif','angry_smile.gif','angel_smile.gif','shades_smile.gif','devil_smile.gif','cry_smile.gif','lightbulb.gif','thumbs_down.gif','thumbs_up.gif','heart.gif','broken_heart.gif','kiss.gif','envelope.gif'] ;/*‘’中的名字对应表情图片文件夹中的图片名称,我们可以修改*/
FCKConfig.SmileyColumns = 8 ;/*每行显示的图片数量,我们可以修改*/
FCKConfig.SmileyWindowWidth = 320 ;/*表情窗口宽度,我们可以修改*/
FCKConfig.SmileyWindowHeight = 210 ;/*表情窗口高度,我们可以修改*/
每句配置的意思我已经注明了,聪明的你现在应该知道该怎么做了吧,^_^。对了,首先得吧表情图片路径给改了,这里将msn改成myface;下面修改每张图片的名字,比如我们myface文件夹下有张0.gif的图片,我们就需要这样修改:FCKConfig.SmileyImages =['0.gif'],这里工作量有点大了哦,慢慢来吧。修改完了我们来试试。OK,如果你照这我做的话效果因该出来了,恭喜……
这里有一点需要提出,QQ表情图片的大小比叫小(长和宽),如果换成比较大的图片,或者你的图片比较多的话你的编辑器表情弹出窗口就会跟着增大,导致整个屏幕无法全部显示,我们来给编辑器表情弹出窗口增加一个功能——显示下拉条。
在fckeditor/editor/dialog目录下找到fck_smiley.html修改他的代码,找到:
window.onload = function ()
{
// First of all, translate the dialog box texts
oEditor.FCKLanguageManager.TranslatePage(document) ;
dialog.SetAutoSize( true ) ;
}
和
<body style="overflow: hidden">
1.将第一段代码的dialog.SetAutoSize( true ) 删除掉,
2.将overflow:hidden改为overflow:scroll
Ok,现在我们的修改已经完全做好了,刷新一下页面,在点击表情,就可以看到弹出的窗口有下拉条了。
精简的方法:fckconfig.js为FckEditor的配置文件,找到如下代码: