ckeditor5添加工具栏
时间: 2023-12-14 16:05:06 浏览: 188
ckeditor5
4星 · 用户满意度95%
以下是在CKEditor 5中添加工具栏的步骤:
1. 在CKEditor 5的构建器中选择所需的插件和工具栏按钮,然后下载构建器生成的zip文件。
2. 将zip文件解压缩到您的项目目录中。
3. 在您的HTML文件中引入CKEditor 5的构建器生成的JS文件和CSS文件。
4. 在您的HTML文件中创建一个textarea元素,并将其ID设置为“editor”。
5. 在您的JavaScript文件中,使用以下代码初始化CKEditor 5:
```javascript
ClassicEditor
.create( document.querySelector( '#editor' ), {
toolbar: [ 'heading', '|', 'bold', 'italic', 'link' ]
} )
.then( editor => {
console.log( editor );
} )
.catch( error => {
console.error( error );
} );
```
6. 在上面的代码中,toolbar选项是一个数组,其中包含您想要在工具栏中显示的按钮。在这个例子中,我们添加了标题,粗体,斜体和链接按钮。
7. 运行您的应用程序并查看CKEditor 5中的工具栏。
阅读全文