KindEditor 自定义插件：实现在内容编辑器中选中任意一张图片将其设置为文章封面缩略图

最新推荐文章于 2024-07-31 16:12:36 发布

tangguose2018

最新推荐文章于 2024-07-31 16:12:36 发布

阅读量1.1k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： javascript 文章标签： KindEditor 自定义插件 javascript 编辑器封面缩略图

本文链接：https://blog.youkuaiyun.com/qq_39963971/article/details/77559395

通过编写自定义插件piclinks.js，实现了在KindEditor内容编辑器中选择图片并将其设为文章封面的功能。用户可以方便地从编辑器内的图片中挑选，点击图标即可完成封面缩略图的设置。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在需要显示编辑器的位置添加textarea输入框。

 
  <textarea id="editor_id" name="editor_id" cols="80" rows="8">
&lt;strong&gt;HTML内容&lt;/strong&gt;
</textarea> 
 

在该HTML页面添加以下脚本。

 
  <script charset="utf-8" src="/editor/kindeditor.js"></script>
<script charset="utf-8" src="/editor/lang/zh-CN.js"></script>
<script>
       var editor;
			
			KindEditor.lang({
				piclinks : '设为封面缩略图'
		    });
	        KindEditor.ready(function(K) {
	                editor = K.create('#editor_id', {
		                	width : '100%', // 编辑器的宽度为70%
		    				height : '550px', // 编辑器的高度为100px
		    				filterMode : false, // 不会过滤HTML代码
		    				resizeMode : 0,
		    				pasteType : 1,
	                        resizeType : 2,

 