替换 kindEditor 编辑器的默认表情

编辑器的表情太少?满足不了写斗图搬的文章?亦或者默认表情太丑没办法体现出我皮革展高逼格的情绪?

好吧,没办法,既然别人给我了我所需求的,那么就自己动手,哪里不好改哪里face

不是我说,这 kindEditor 表情是真滴  7+1 反正我是不喜欢face,好了废话不多说了,来看看该怎么改。

首先 每个版本的可能不一样,虽说也不会有什么新版本了,这编辑器最后更新在16年,看情况是没戏了face。还是趁着换一个吧,但是我还在用那我就得为了我自己,折腾一番。


    1、表情是在一个 emoticons 的目录,把里面的 images 的表情换掉就行了。。。行了?face    不不不,当然还不行 替换上去的是 gif 格式的话算是行了,但你会发现 这几个叼毛还在。

这是因为 这里显示的是 一张 static.gif 的图片。在images里面找到这张图片,然后自行弄一张回去就行了,前提是排的顺序要一致,不然就会错乱。另外如果没有好看的表情包的话可以去看看这篇,里面超多可爱的 表情包


2、如果替换的表情是非 gif 的图片,那么就要多走一步了。 把编辑器的入口文件 即是 kindeditor-all.js 这个文件,然后找到下面一段,修改每个后面的 .gif 格式为 想要的格式。

KindEditor.plugin('emoticons', function(K) {
	var self = this, name = 'emoticons',
		path = (self.emoticonsPath || self.pluginsPath + 'emoticons/images/'),
		allowPreview = self.allowPreviewEmoticons === undefined ? true : self.allowPreviewEmoticons,
		currentPageNum = 1;
	self.clickToolbar(name, function() {
		var rows = 5, cols = 9, total = 135, startNum = 0,
			cells = rows * cols, pages = Math.ceil(total / cells),
			colsHalf = Math.floor(cols / 2),
			wrapperDiv = K('
'), elements = [], menu = self.createMenu({ name : name, beforeRemove : function() { removeEvent(); } }); menu.div.append(wrapperDiv); var previewDiv, previewImg; if (allowPreview) { previewDiv = K('
').css('right', 0); previewImg = K('');//此处gif格式改成替换的图片格式 wrapperDiv.append(previewDiv); previewDiv.append(previewImg); } function bindCellEvent(cell, j, num) { if (previewDiv) { cell.mouseover(function() { if (j > colsHalf) { previewDiv.css('left', 0); previewDiv.css('right', ''); } else { previewDiv.css('left', ''); previewDiv.css('right', 0); } previewImg.attr('src', path + num + '.gif');//此处gif格式改成替换的图片格式 K(this).addClass('ke-on'); }); } else { cell.mouseover(function() { K(this).addClass('ke-on'); }); } cell.mouseout(function() { K(this).removeClass('ke-on'); }); cell.click(function(e) { //此处gif格式改成替换的图片格式 self.insertHtml('').hideMenu().focus(); e.stop(); }); } function createEmoticonsTable(pageNum, parentDiv) { var table = document.createElement('table'); parentDiv.append(table); if (previewDiv) { K(table).mouseover(function() { previewDiv.show('block'); }); K(table).mouseout(function() { previewDiv.hide(); }); elements.push(K(table)); } table.className = 'ke-table'; table.cellPadding = 0; table.cellSpacing = 0; table.border = 0; var num = (pageNum - 1) * cells + startNum; for (var i = 0; i < rows; i++) { var row = table.insertRow(i); for (var j = 0; j < cols; j++) { var cell = K(row.insertCell(j)); cell.addClass('ke-cell'); bindCellEvent(cell, j, num); var span = K('') .css('background-position', '-' + (24 * num) + 'px 0px') .css('background-image', 'url(' + path + 'static.gif)');//此处是那张static图片的后缀 cell.append(span); elements.push(cell); num++; } } return table; } var table = createEmoticonsTable(currentPageNum, wrapperDiv); function removeEvent() { K.each(elements, function() { this.unbind(); }); } var pageDiv; function bindPageEvent(el, pageNum) { el.click(function(e) { removeEvent(); table.parentNode.removeChild(table); pageDiv.remove(); table = createEmoticonsTable(pageNum, wrapperDiv); createPageTable(pageNum); currentPageNum = pageNum; e.stop(); }); } function createPageTable(currentPageNum) { pageDiv = K('
'); wrapperDiv.append(pageDiv); for (var pageNum = 1; pageNum <= pages; pageNum++) { if (currentPageNum !== pageNum) { var a = K('[' + pageNum + ']'); bindPageEvent(a, pageNum); pageDiv.append(a); elements.push(a); } else { pageDiv.append(K('@[' + pageNum + ']')); } pageDiv.append(K('@ ')); } } createPageTable(currentPageNum); }); });

改好后就,看下效果

嗯,不错不错,表情很可爱face


分享

上一篇:没有了
下一篇:没有了

发表评论

提交评论

清空信息
关闭评论

评论列表