ckeditor(在线文本编辑器)使用教程
ckeditor是一款由javascript编写的富文本网页编辑器,它可以填写文字、插入图片、视频、Excel等富媒体信息,也可以在源码方式下填写内容,在各个网站中应用非常广泛。
下面就来说说ckeditor到底是怎么使用的。
方法/步骤
首先百度中输入ckeditor,第一个链接就是它的官网,点击进入。
点击右侧的download按钮。
接下来会提示要下载哪种类型的包,建议第三种full package,因为这个全,点击Download CKEditor将它下载下来。
解压下载后的zip包,可以看到它里面有好多的js和css。
接下来就要进行配置了。
第一步:将ckeditor整个文件夹放到网站资源目录下,如下图。
第二步:在要添加ckeditor的网页上加入ckeditor.js,如下图。
第三步:在要转换成富文本的textarea下方编写js:CKEDITOR.replace('textarea的name'),如下图。
第四步:打开网站查看效果,如下图。
这样就简单快捷地实现了网页在线编辑器,不过这个编辑器看上去呆呆的,其实它还可以变得更加漂亮呢,改天再写怎么样让它变得漂亮起来。
ckeditor(在线文本编辑器)使用教程的更多相关文章
- 基于jquery的bootstrap在线文本编辑器插件Summernote
Summernote是一个基于jquery的bootstrap超级简单WYSIWYG在线编辑器.Summernote非常的轻量级,大小只有30KB,支持Safari,Chrome,Firefox.Op ...
- Jquery的bootstrap在线文本编辑器插件Summernote
http://www.jqcool.net/demo/201407/bootstrap-summernote/ Summernote是一个基于jquery的bootstrap超级简单WYSIWYG在线 ...
- CKEditor富文本编辑器
CKEditor 富文本即具备丰富样式格式的文本.在运营后台,运营人员需要录入课程的相关描述,可以是包含了HTML语法格式的字符串.为了快速简单的让用户能够在页面中编辑带格式的文本,我们引入富文本编辑 ...
- javascript 在线文本编辑器
javascript 在线文本编辑器实现代码. 效果例如以下: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvcGhwZmVuZ2h1bw==/font/5 ...
- 项目页面集成ckeditor富文本编辑器
步骤一.引入ckeditor.js (注:本实例以ThinkPHP3.2框架为载体,不熟悉ThinkPHP的朋友请自行补习,ckeditor文件代码内容也请去ckeditor官网自行下载) 作为程序员 ...
- django中ckeditor富文本编辑器使用
1.安装模块 (pillow是python的一个图像处理库) pip install django-ckeditor pip install pillow 2.编辑seetings.py配置文件 IN ...
- day82:luffy:课程详情页面显示&章节和课时显示&视频播放组件&CKEditor富文本编辑器
目录 1.初始课程详情页面 2.视频播放组件 3.课程详情页面后端接口实现 4.课程详情页面-前端 5.CKEditor富文本编辑器 6.课程章节和课时显示-后端接口 7.课程章节和课时显示-前端 1 ...
- $Django 在线文本编辑器skindeditor
简介 KindEditor是一套开源的在线HTML编辑器,主要用于让用户在网站上获得所见即所得编辑效果,开发人员可以用 KindEditor 把传统的多行文本输入框(textarea)替换为可视化的富 ...
- Django添加ckeditor富文本编辑器
源码 https://github.com/django-ckeditor/django-ckeditor 通过pip安装. pip3 install django-ckeditor pip3 ins ...
- 搭建自己的博客(十三):为博客后台添加ckeditor富文本编辑器
使用django默认的编辑器感觉功能太少了,所以集成一下富文本编辑器. 1.安装和使用 (1).安装 pip install django-ckeditor (2).注册应用 在django的sett ...
随机推荐
- Effective Objective-C [下]
http://esoftmobile.com/2013/08/17/effective-objective-c-2/ Chapter 6: Blocks and Grand Central Dispa ...
- bzoj2751 容易题
传送门 题目 为了使得大家高兴,小Q特意出个自认为的简单题(easy)来满足大家,这道简单题是描述如下: 有一个数列A已知对于所有的A[i]都是1~n的自然数,并且知道对于一些A[i]不能取哪些值,我 ...
- a标签空的情况下 IE6 IE7下点击无效
如果给空a标签定义了宽度和高度且使用了absolute,则在IE6和IE7中点击无效. 两种解决方法(主要是针对a标签不能设置背景情况): 1.给a标签添加样式:background: ...
- vimrc 我的专属vim配置
set nu set wrap syntax on filetype on "打开vim文件类型自动检测功能 set autoindent set smartindent set ruler ...
- C++新标准:列表初始化
一.列表初始化意义 C++新标准为vector提供了一种新的初始化方式:列表初始化.适用于知道多个成员具体值的情况. 二.列表初始化用法 /*1.空vector<int>*/ vector ...
- excel导入工具
1 介绍 excel导入工具 整个项目的代码结构如下 \---excelExport # 导出工具包 | AsyncExportExcel.java #多线程导出 | ExcelImport.java ...
- webservice服务及客户端 编程 - 入门
开发工具 eclipse 建立一个简单的webservice服务 1 创建服务 (1)创建一个 java项目(java project)或 web项目(Dynamic web project) (2) ...
- 三大文本处理工具grep、sed及awk
一. 用grep在文件中搜索文本 grep能够接受正则表达式,生成各种格式的输出.除此之外,它还有大量有趣的选项. 1. 搜索包含特定模式的文本行: 2. 从stdin中读取: 3. 单个g ...
- C语言数据结构-队列的实现-初始化、销毁、清空、长度、队列头元素、插入、删除、显示操作
1.数据结构-队列的实现-C语言 //队列的存储结构 #define MAXSIZE 100 typedef struct { int* base; //基地址 int _front; //头指针 i ...
- Qt 学习之路 2(26):反走样
Qt 学习之路 2(26):反走样 豆子 2012年11月12日 Qt 学习之路 2 9条评论 我们在光栅图形显示器上绘制非水平.非垂直的直线或多边形边界时,或多或少会呈现锯齿状外观.这是因为直线和多 ...