在网站/其他应用编辑富文本时,需要在线编辑器来编辑文本,目前比较好用的有kindeditor编辑器,虽然2017年之后官方再无更新,不过开发者可以根据实际项目需求进行个性化配置工具栏面板,以便于使用。
比如:我要配置简单的kindeditor工具栏,如下图:
像这种简单实用的工具栏面板如何配置呢?
需要在引用kindeditor编辑器的html/视图文件中,在下面方法中
KindEditor.ready(function(K) {
//code->add items attribute
})
添加items中想要的属性就可以实现,items项中就是自定义想要的按钮功能,很简单吧!
如下图,已添加的一些属性:
----------------------------------END!
下面是items主要属性的释义参考:
source:表示切换编辑器进入源代码HTML查看模式;
wordpaste:表示从WORD内粘贴;
justifyleft:表示选中文本居左;
justifycenter:表示选中文本居中;
justifyright:表示选中文本居右;
justifyfull:表示两端对齐;
clearhtml:表示清除HTML标签;
quickformat:表示快速排版;
selectall:表示全选;
fullscreen:表示全屏;
formatblock:表示段落;
fontname:表示字体;
fontsize:表示文字大小;
forecolor:表示文字颜色;
hilitecolor:表示文字背景色;
bold:表示文字加粗;
italic:表示文字斜体;
underline:表示给文字追加下划线;
strikethrough:表示给文字追加删除线;
lineheight:表示调整行距;
removeformat:表示删除选中段的格式;
image:表示单个上传图片;
multiimage:表示批量上传图片;
media:表示插入音视频文件;
insertfile:表示插入文件;
table:表示插入表格;
hr:表示插入横线;
emoticons:表示插入表情;
baidumap:表示插入地图;
link:表示插入超链接;
unlink:表示取消超级链接;一般和link配合出现;
about:表示关于kindeditor编辑器的信息;
kindeditor编辑器下载地址:https://gitee.com/luolonghao/kindeditor
上一篇:PHP中如何操作数据库?
扫一扫 加微信咨询