CKEditor作为一看非常好用的所见即所得HTML编辑器,一直被大量广泛使用。CKEditor 4作为非常流行的HTML富文本编辑器,功能可谓是非常强大,并且使用还很简单。
可以直接从Word和Excel粘贴。优秀的表格支持,可以列调整大小,选择行和列。媒体嵌入(插入视频,推文,Instagram帖子等),小部件,代码片段,数学公式。自动完成,@ mentions,表情符号 😊插件。内联和iframe UI,自动增长,最大化无干扰写作模式。只读模式。各种样式和格式插件,复制格式功能。
CKEditor是一个在线WYSIWYG编辑器,用于在浏览器中编辑HTML文档(或其片段)。
那么这是什么意思?
在“在线”部分是指CKEditor的作品在网络浏览器(如Firefox,Chrome浏览器,Internet Explorer或Safari)。因此,它不是可以安装在您的计算机上然后作为桌面应用程序打开的独立程序。
在“所见即所得”的一部分,是指当您使用CKEditor的,你可以样式的文本,并通过使用编辑器UI实时富媒体内容添加到您的文档(工具栏按钮,对话框窗口),结果将立即可见。如果单击“ 粗体”按钮,文本将变为粗体; 添加图像时,它会立即出现。
CKEditor适用于HTML,HTML是一种用于创建Web内容的标记语言。然而,CKEditor给你的巨大好处是你不需要直接看HTML代码也不需要理解它的复杂性。编辑器在这里是一种中介 - 它隐藏了你的HTML代码,让你只是以所见即所得的方式工作。
在“编辑HTML文档”部分表示该编辑器可以用来编辑任何HTML内容,如网站内容(博客文章,博客评论,论坛帖子),电子邮件,或在网络表单中填写的东西。但并非全部:CKEditor也可用于各种在线应用程序,即所有那些使用HTML作为源文本格式并在浏览器中运行的应用程序!
什么CKEditor不是
在某些情况下,CKEditor似乎只是您需要的工具,而事实并非如此。例如:
CKEditor既不是图形网页设计工具,也不是网站建设者。如果您想要一个可以帮助您设计网站的工具,那么CKEditor就不是您想要的了。
CKEditor不是内容管理系统(CMS)。它不包含用于存储帖子的任何类型的数据库,用于用户管理的日志记录系统或管理面板,您可以在其中调整网站的选项。
CKEditor不是桌面出版软件(它不是Word!),并且在创建具有用于打印的固定布局和样式的分页内容时不是推荐使用的工具。
CKEditor在其默认实现中开箱即用不是像Google Docs这样的工具,多个用户可以在线实时编辑同一篇文章,跟踪更改并添加注释。但是,您可以尝试找到一些可以帮助您扩展其可能性的插件或工具。
CKEditor不是可以将文档转换或保存为任何特定文件格式(如.docxPDF)的应用程序,尽管它可以与其他工具集成以实现此结果。它的输入和输出格式是HTML。
CKEditor不是一个允许您输入无效HTML代码的工具。CKEditor遵守W3C标准,因此如果代码无效,它将修改代码。
在一天结束时,CKEditor是一名编辑 - 仅此而已。转到CKEditor示例部分,查看大量有效的编辑器用例,准备好在您自己的解决方案中复制和实现源代码!
CKEditor如何工作
Web内容是用HTML创建的,HTML是一种标记语言,包括描述此文本的文本和特殊标记,以及为其添加语义含义。这些标记用于将特定内容元素标记为“标题”,“段落”,“粗体文本”等.CKEditor仅隐藏用户的HTML标记,并在图形用户界面中显示其等价物(如粗体工具栏按钮)以及输出已应用格式的文本。
但这有一些后果。CKEditor适用于HTML代码并且做得很好,它需要获取正确的HTML代码作为输入。如果源文档不正确,CKEditor将尝试修复它以便能够应用其内容转换。
但是,CKEditor不是一个人,所以当你创建错误的HTML代码时,它无法猜测你的意图,这可能会导致一些意想不到的后果。为了避免出现问题,输入提供程序(您!)需要确保CKEditor获得的是干净,符合标准的HTML代码。如果是这种情况,CKEditor将按预期工作并输出干净,符合标准的HTML代码作为回报。
那么如何快速上手CKEditor呢?
访问官方CKEditor下载站点。对于生产站点,我们建议您选择默认的标准包,然后单击下载CKEditor按钮以获取.zip安装文件。如果您想尝试更多编辑器功能,可以下载完整包。将下载的.zip存档解压缩(解压缩)到ckeditor您网站根目录中。此外,您可以单击编辑器示例页面上的工具栏配置器按钮打开一个方便的工具,使您可以根据需要调整工具栏。
将CKEditor添加到您的页面。如果示例正常工作,您就可以使用CKEditor构建自己的站点了。首先,创建一个包含<textarea>元素的简单HTML页面。然后,您需要做两件事:<script>在页面中包含加载CKEditor 的 元素。使用该CKEDITOR.replace()方法<textarea>用CKEditor 替换现有元素。
到这里最基本的使用已经完成了,是不是特别的便捷,特别的简单。根本不需要翻弄什么笨重的教程和文档了呢。