新知榜官方账号
2023-11-14 08:20:20
TinyMCE5.0是一个功能强大且灵活的富文本编辑器,可以嵌入到任意Web应用中使用。它是一个轻量级的基于浏览器的所见即所得编辑器,支持目前流行的各种浏览器,采用JavaScript/ECMAScript开发。主要特性包括主题/模板支持,多语言支持(包括简体中文),支持通过插件的方式进行扩展。功能配置灵活简单,支持AJAX,加载速度非常快。最重要的是,TinyMCE是一个根据LGPLlicense发布的自由软件,你可以把它用于商业应用。
使用TinyMCE只需要在
中引入官网的tinymce.min.js文件到项目中,例如:<head><script src="https://cloud.tinymce.com/5/tinymce.min.js?apiKey=官方申请的API_KEY"></script></head>
建议下载一份代码到本地,或者创建一个TinyMCE实例初始化:
<!DOCTYPE html><html><head><script src="/tinymce/tinymce.min.js"></script><script>tinymce.init({selector:'textarea'});</script></head><body><textarea>Next,useourGetStarteddocstosetupTiny!</textarea></body></html>
TinyMCE提供了经典模式、内联模式、沉浸模式,可根据实际需求选择合适的模式。
经典模式也是TinyMCE的默认模式,其界面与其他流行的富文本编辑器样式功能一致。
将编辑视图与阅读视图合二为一,当其被点击后,元素才会被编辑器替换,而不是编辑器始终可见。
在该模式下,编辑器以轻巧的方式呈现。此模式提供了将常用的链接、图像、表格等以快速插入的方式。
用户可以轻松自定义菜单、工具栏,也可以方便的修改编辑器的大小、外观、按钮等等。TinyMCEv5的默认皮肤是“oxide”,它包含浅色版本和深色版本。下面的例子将使用深色版皮肤。
tinymce.init({selector:'#tinydemo',skin:'oxide-dark',});
使用content_css自定义可编辑区域。
tinymce.init({selector:'#tinydemo',content_css:['mycontent.css','mycontent2.css'],});
粘性工具栏(或停靠工具栏),在向下滚动网页直到不再可见编辑器时,将工具栏和菜单停靠在屏幕顶部。
tinymce.init({selector:'#tinydemo',toolbar_sticky:true,});
TinyMCE对插件有完善的支持,它本身自带了许多实用的插件,而社区则提供了更多优秀的插件。插件的开发,正是得益于TinyMCE预留接口的友好。实际上,如果您使用自定义程序包下载选项,则只能使用列表中选择包含的插件。以下是一些常用的插件:
相关工具
相关文章
相关快讯
推荐
GPT-5没你想的那么好,附实测体验~
2025-08-11 11:07
一站式搞定AI绘图+视频,AI短片效率飙升的秘密在这儿!
2025-08-08 09:26
打工人新神器!10款国产AI,让你告别996!
2025-08-08 09:24
豆包视觉推理深度体验,AI也能“边看边想”了!
2025-08-08 09:19
300美元的AI男友来了!马斯克的情感生意从女友做到男友
2025-08-01 17:56
Agent智能体:2025年企业新员工,月薪仅需一度电?
2025-07-30 17:49
国产GLM-4.5把AI价格打到地板价,实测强到离谱!
2025-07-30 09:08
用AI批量生成治愈系漫画,月入2000+
2025-07-29 09:59
千亿市场规模背后,AI短剧商业化迎来爆发期?
2025-07-17 09:19
15个作品涨粉26万!AI历史账号又出王炸案例!
2025-07-09 09:37