1、首先需要下载并配置好CKEditor 5代码，将CKEditor 5整个文件夹放到网站资源目录下，然后在需要添加CKEditor编辑器的页面中引入CKEditor 5的核心文件ckeditor.js以及语言包文件zh-cn.js：
<script src="ckeditor5/build/ckeditor.js"></script>
<script src="ckeditor5/build/translations/zh-cn.js"></script>
2、然后在需要引用编辑器的位置插入以下代码：
<textarea name="content" id="editor"></textarea>
<script>
ClassicEditor
.create( document.querySelector( '#editor' ) ,{
language: 'zh-cn', //设置编辑器语言为中文，前提是需要引入zh-cn.js文件
})
.catch( error => {
console.error( error );
});
</script>
3、设置编辑器宽度与高度：
<style>
body {
max-width: 800px;
margin: 20px auto;
}
.ck-editor__editable {
min-height: 300px;
}
</style>
4、完整代码如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CKEditor 5</title>
<style>
body {
max-width: 800px;
margin: 20px auto;
}
.ck-editor__editable {
min-height: 300px;
}
</style>
<script src="ckeditor5/build/ckeditor.js"></script>
<script src="ckeditor5/build/translations/zh-cn.js"></script>
</head>
<body>
<h1 align="center">在线编辑器</h1>
<textarea name="content" id="editor"></textarea>
<script>
ClassicEditor
.create( document.querySelector( '#editor' ) ,{
language: 'zh-cn',
})
.catch( error => {
console.error( error );
});
</script>
</body>
</html>
本文暂时没有评论，来添加一个吧(●'◡'●)