我使用<script src="https://nightly.ckeditor.com/full/ckeditor.js"></script>语法添加了ckeditor。我的ckeditor编辑器工具栏如下所示。
<script src="https://nightly.ckeditor.com/full/ckeditor.js"></script>
ckeditor
我想添加新的功能到现有的图标。我该怎么做?
wi3ka0sx1#
使用此CKEditor版本CDN
<script src="https://cdn.ckeditor.com/ckeditor5/35.3.2/super-build/ckeditor.js"></script>
供参考:- www.example.com
qco9c6ql2#
让我知道你正在使用的技术堆栈,
纯Javascript:
<script> editor = CKEDITOR.replace("container"); editor.addCommand("mySimpleCommand", { exec: function (edt) { alert(edt.getData()); }, }); editor.ui.addButton("SuperButton", { label: "Click me", command: "mySimpleCommand", toolbar: "insert", icon: "https://cdn4.iconfinder.com/data/icons/24x24-free-pixel-icons/24/Clock.png", }); </script>
检查planet icon之外的工具栏选项中的时钟图标。检查codesandbox演示here
planet icon
像React这样的框架。js:
尝试添加这样的插件,
CKEDITOR.plugins.add("timestamp", { init: function (editor) { editor.addCommand("insertTimestamp", { exec: function (editor) { var now = new Date(); editor.insertHtml(now.toString()); }, }); editor.ui.addButton("Timestamp", { label: "Insert Timestamp", command: "insertTimestamp", toolbar: "insert", icon: "https://cdn4.iconfinder.com/data/icons/24x24-free-pixel-icons/24/Clock.png", }); }, });
检查工具栏选项中smiley icon旁边的clock icon。您可以添加要在exec函数中执行的功能希望这对你有帮助
smiley icon
clock icon
exec
2条答案
按热度按时间wi3ka0sx1#
使用此CKEditor版本CDN
供参考:- www.example.com
qco9c6ql2#
让我知道你正在使用的技术堆栈,
纯Javascript:
检查
planet icon
之外的工具栏选项中的时钟图标。检查codesandbox演示here
像React这样的框架。js:
尝试添加这样的插件,
检查工具栏选项中
smiley icon
旁边的clock icon
。您可以添加要在exec
函数中执行的功能希望这对你有帮助