HTML 富文本编辑器插件 CKEditor

﹏ヽ暗。殇╰゛Y 2022-06-15 00:14 441阅读 0赞

CKEditor 首页： [http://ckeditor.com/][http_ckeditor.com]

# 一、使用 #

1、将ckeditor整个文件夹放到网站资源目录下。

![Image 1][]

![Image 1][]![079606c0-c640-494a-9b2d-24292d5165f2][]

2、  在要添加ckeditor的网页上加入ckeditor.js。

<!DOCTYPE html>
    <html lang="en">
    <head>
        
        <script src="resourse/ckeditor/ckeditor.js"></script>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>

3、 在要转换成富文本的textarea下方编写js：CKEDITOR.replace('textarea的name')

<!DOCTYPE html>
    <html lang="en">
    <head>
        
        <script src="resourse/ckeditor/ckeditor.js"></script>
        <meta charset="UTF-8">
        <title>Title</title>
    </head>
    <body>
        <textarea rows="30" cols="50" name="editor01">请输入.</textarea>
        <script type="text/javascript">CKEDITOR.replace('editor01');</script>
    </body>
    </html>

# 二、添加 【粘贴图片为 base64 格式】插件 #

下载 CKEditor 时需要添加 Paste image as base64 插件

插件地址：[http://ckeditor.com/addon/pastebase64][http_ckeditor.com_addon_pastebase64]

![Image 1][]

点击 【Add to my editor】,【Build My Editor】下载自定义 CKEditor，可选风格、插件、皮肤、语言等。

[http_ckeditor.com]: http://ckeditor.com/
[Image 1]: 
[079606c0-c640-494a-9b2d-24292d5165f2]: https://app.yinxiang.com/shard/s45/res/079606c0-c640-494a-9b2d-24292d5165f2
[http_ckeditor.com_addon_pastebase64]: http://ckeditor.com/addon/pastebase64

发表评论取消回复

表情：

评论列表（有 0 条评论，441人围观）

还没有评论，来说两句吧...

相关阅读

相关常用的富文本编辑器插件

文章目录 * 常用的富文本编辑器插件 * * * * 1、TinyMCE * 2、百度 ueditor|UEditor...

阳光穿透心脏的1/2处/ 2024年04月19日 12:50/ 0 赞/ 89 阅读

相关 CKEditor 富文本编辑器转PDF

KEditor是新一代的[FCKeditor][]，是一个重新开发的版本。CKEditor是全球最优秀的网页在线文字编辑器之一，因其惊人的性能与可扩展性而广泛的被运用于各...

痛定思痛。/ 2024年04月17日 20:19/ 0 赞/ 90 阅读

相关 CKEditor富文本编辑器实现图片上传java

一、构建一个富文本编辑器： <textarea name="editor" id="editor" rows="10" cols="80"> This

红太狼/ 2023年10月11日 11:12/ 0 赞/ 47 阅读

相关 vue 使用CKEditor 富文本

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhp

Myth丶恋晨/ 2023年10月09日 11:14/ 0 赞/ 47 阅读

相关 ckeditor富文本编辑器使用行间距插件lineheight扩充，改变行距

1、首先需要下载一个lineheight包，网上很多资源都需要花钱或者花积分下载找到ckeditor官网，在以下链接中直接下载即可 [https://ckeditor

野性酷女/ 2023年01月13日 05:44/ 0 赞/ 429 阅读

相关 html5富文本编辑器图片,漂亮的富文本编辑器WYSIWYG

![5aaaddac4dbb2307489796843d65bb62.png][] ![94a6dc5feabd4193c6b752bf51a273a1.png][] 插件

柔光的暖阳◎/ 2022年10月06日 07:57/ 0 赞/ 359 阅读

相关 ckeditor富文本编辑器(Django 3.2)

安装ckeditor pip install django-ckeditor 如图： ![watermark_type_ZHJvaWRzYW5zZmFsbGJhY

清疚/ 2022年09月14日 14:25/ 0 赞/ 254 阅读

相关 HTML 富文本编辑器插件 CKEditor

CKEditor 首页： [http://ckeditor.com/][http_ckeditor.com] 一、使用 1、将ckeditor整个文件夹放到网

﹏ヽ暗。殇╰゛Y/ 2022年06月15日 00:14/ 0 赞/ 442 阅读

相关 Django项目之CKEditor富文本编辑器

1. 安装 pip install django-ckeditor 2. 添加应用在INSTALLED\_APPS中添加 INSTALLED_

小灰灰/ 2022年05月06日 15:57/ 0 赞/ 563 阅读

相关富文本编辑器Django-ckeditor

富文本编辑器Django-ckeditor 前言刚开始学习django的时候，在后台编辑数据的时候，总是在想，功能是否太简陋了点，只能做简单的文本编辑，所以

痛定思痛。/ 2021年12月15日 02:19/ 0 赞/ 390 阅读