kindeditor使用方法,kindeditor怎么设置长宽度

kindeditor使用方法,kindeditor怎么设置长宽度,第1张

方法/步骤

1

首先我们需要kindeditor及其相关文件,这些文件可以去网上找,很容易找到。

2

下载完成后会看到很多文件,但是我们只需要其中的三个主要文件,如下图,把这三个文件拷贝到你的项目中,不要忘记jQuery文件。

3

然后就是使用方法了,其实这个kindeditor就是把textare框美化了一下,添加了一些功能。所以在html中,我们需要有一个textare框,给它一个id。

4

之后我们需要引入jQuery及kindeditor的js文件,其它的文件kindeditor会自动调用,不必手动引用。然后在js中写相关的语句就可以了,如下图:

5

kindeditor的长度和宽度都可以通过参数来设置,其中width来设置宽度,最好用百分数,height来设置高度。

KindEditor.create('#editor_id',{allowImageUpload:false,resizeType : 1,width:"50%",height:"200px"})

6

除了用参数设置kindeditor大小之外,我们看html源码还可以看到kindeditor大小由class为ke-container和ke-container-default所在的div控制,所以我们可以给ke-container和ke-container-default设置一个宽度和高度,要确保其优先级最高,所以加!important。

.ke-container.ke-container-default{

width:600px!important

height:100px!important

}

使用方法:

把解压出来的 kindeditor 文件夹,放置到网站的根目录中;注意,为了实现视频显示页面位置不受限制同时不用改变视频调用代码,本插件文件引用均以相对跟目录的绝对路径,如果不放在根目录,对应路径需要全部修改,否则不能正常显示;建议不要改动

在发布文集页面调用已加入视频播放器插件的kindeditor,调用方法参照http://www.kindsoft.net/docs/usage.html 中的说明。如果自定义配置了辑器的工具栏的情况下,请务必在 items 加入 'insertfile',位置无要求

如:

items : [

'source', '|', 'undo', 'redo', '|', 'preview', 'print', 'template', 'code', 'cut', 'copy', 'paste',

'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',

'justifyfull', 'insertorderedlist', 'insertunorderedlist', 'indent', 'outdent', 'subscript',

'superscript', 'clearhtml', 'quickformat', 'selectall', '|', 'fullscreen', '/',

'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',

'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'multiimage',

'flash', 'media','insertVideo', 'insertfile', 'table', 'hr', 'emoticons', 'baidumap', 'pagebreak',

'anchor', 'link', 'unlink', '|', 'about'

],

对于通过插件工具栏按钮插入生成的代码不要改动,均有其作用的

在显示文集页面调用视频播放器ckplayer

<script charset="utf-8" src="/kindeditor/plugins/insertVideo/ckplayer/ckplayer.js"></script>

完成以上步骤即可,使用本插件。


欢迎分享,转载请注明来源:内存溢出

原文地址:https://54852.com/tougao/11693238.html

(0)
打赏 微信扫一扫微信扫一扫 支付宝扫一扫支付宝扫一扫
上一篇 2023-05-18
下一篇2023-05-18

发表评论

登录后才能评论

评论列表(0条)

    保存