精华内容
下载资源
问答
  • ckeditor使用教程
    千次阅读
    2016-08-25 14:52:55

    引用CKEDITOR的JS文件:

    添加其JS文件<script type="text/javascript" src="ckeditor/ckeditor.js"></script>

    替换TEXTAREA标签:

    <textarea rows="30" cols="50" name="editor01">请输入.</textarea>
    <script type="text/javascript">CKEDITOR.replace('editor01');</script>

    或者在head区域引入

    <script type="text/javascript">
        window.onload = function()
        {
            CKEDITOR.replace( 'editor01' );
        };
    </script>

    当然还有一个方法CKEDITOR.appendTo(elementOrId, config) 它可以在特定的dom对象中创建CKEDITOR

    <div id="editorSpace"><:/div>
    
    CKEDITOR.appendTo( 'editorSpace' );

    CKEditor的基本用法
    一、在页面中加载CKEDITOR编辑器:

    1:CKEDITOR.replaceelement,config):用编辑器取代element
    2:CKEDITOR.appendTo(element,config,html):在element后面添加编辑器

    二、常用的方法:

    获得编辑器中的内容:getData();
    设置编辑器中的内容:setData();
    编辑器的宽度:config.width = 640;
    编辑器的高度:config.height = 100;
    全部菜单:config.toolbar = 'Full';
    基础菜单:config.toolbar = 'Basic';
    自定义菜单:config.toolbar_Full = []
    更多相关内容
  • CKEditor使用教程

    2013-09-02 21:08:55
    FCKEditor简单教程,适合新手入门.
  • 一般来说,我们在编辑内容时,先是读入到 textarea,再将 textarea 的内容赋给编辑器。
  • CKEditor使用

    2021-03-06 17:34:15
    简介CKEditor是一个富文本...基本使用1、首先,下载地址:https://ckeditor.com/ckeditor-4/download/ 下载之后将下载包中的js和css导入项目中。2、然后,写一个简单的带一个textarea的页面。Titleclass="ckedito...

    简介

    CKEditor是一个富文本编辑器。是一种内嵌于网站中,呈现一种所见即所得的页面效果。常见于博客类型网站、或者电商网站管理系统中对商品文案的编辑功能。

    基本使用

    1、首先,下载地址:https://ckeditor.com/ckeditor-4/download/ 下载之后将下载包中的js和css导入项目中。

    2、然后,写一个简单的带一个textarea的页面。

    Title

    class="ckeditor"

    name="content" cols="120" rows="15" placeholder="请输入内容">

    CKEDITOR.replace('content', {

    "filebrowserUploadUrl" : "upload"

    });

    3、接下来,编写页面需要的上传和下载,显示图片的servlet。代码如下:

    package com.qianfeng.day9.servlet;

    import com.qianfeng.day9.util.Constants;

    import javax.servlet.ServletException;

    import javax.servlet.annotation.WebServlet;

    import javax.servlet.http.HttpServletRequest;

    import javax.servlet.http.HttpServletResponse;

    import java.io.File;

    import java.io.FileInputStream;

    import java.io.IOException;

    import java.io.OutputStream;

    @WebServlet("/file.do")

    public class FileServlet extends BaseServlet {

    public void show(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    String name = request.getParameter("name");

    try {

    File file = new File(Constants.IMAGE_PATH + name);

    FileInputStream inputStream = new FileInputStream(file);

    OutputStream outputStream = response.getOutputStream();

    byte [] buffer = new byte[1024];

    int len = 0;

    while ((len = inputStream.read(buffer)) != -1){

    outputStream.write(buffer, 0, len);

    outputStream.flush();

    }

    outputStream.close();

    inputStream.close();

    }catch (Exception e){

    e.printStackTrace();

    }

    }

    public void download(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    String name = request.getParameter("name");

    try {

    response.setHeader("Content-Disposition", "attachment;fileName="+"1.jpg");

    File file = new File(Constants.IMAGE_PATH + name);

    FileInputStream inputStream = new FileInputStream(file);

    OutputStream outputStream = response.getOutputStream();

    byte [] buffer = new byte[1024];

    int len = 0;

    while ((len = inputStream.read(buffer)) != -1){

    outputStream.write(buffer, 0, len);

    outputStream.flush();

    }

    outputStream.close();

    inputStream.close();

    }catch (Exception e){

    e.printStackTrace();

    }

    }

    }

    package com.qianfeng.day9.servlet;

    import com.qianfeng.day9.util.Constants;

    import javax.servlet.ServletException;

    import javax.servlet.annotation.MultipartConfig;

    import javax.servlet.annotation.WebServlet;

    import javax.servlet.http.HttpServlet;

    import javax.servlet.http.HttpServletRequest;

    import javax.servlet.http.HttpServletResponse;

    import javax.servlet.http.Part;

    import java.io.IOException;

    import java.io.PrintWriter;

    import java.util.UUID;

    @MultipartConfig

    @WebServlet("/upload")

    public class UploadServlet extends HttpServlet {

    @Override

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

    request.setCharacterEncoding("utf-8");

    Part part = request.getPart("upload");

    PrintWriter out = response.getWriter();

    // 文件名称

    String name = UUID.randomUUID().toString().replaceAll("-", "");

    part.write(Constants.IMAGE_PATH + name);

    String callback = request.getParameter("CKEditorFuncNum");

    out.println("

    out.println("window.parent.CKEDITOR.tools.callFunction("+ callback + ",'" +

    request.getContextPath() + "/file.do?m=show&name="+ name + "','')");

    out.println("");

    }

    @Override

    protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {

    doGet(req, resp);

    }

    }

    总结

    按照如上3个步骤,基本可以演示一个完整的CKEditor的使用。

    展开全文
  • ckeditor 使用说明,手把手,详细步骤: ckeditor-5 online-builder,持续更新中~~

    使用背景:

    1.业务需求:商城管理后台商品详情数据保存修改。
    2.技术框架:HTML原生 代码。
    3.分析结果:使用富文本js插件 编辑修改保存,商品详情信息。
    4.插件选择要求:文字+图片,类似word风格,社区稳定,大厂出品,代码开源。
    5.最终确定使用:ckeditor ,最新版本
    :ckeditor-5
    6.项目时间 : 2022年5月6日

    下面演示:html原生代码,使用j引用的方式,定制 ckeditor-5 功能:
    

    一、打开 ckeditor-5 定制网站,进行插件定制以及下载:

    1.打开地址:选择 【经典模式】 classic,
    (其他模式没有尝试、本项目不需要,有愿意尝试的同学自行尝试、探索。)
    https://ckeditor.com/ckeditor-5/online-builder/
    截图↓:
    在这里插入图片描述
    2.根据项目需要,选择,插件的功能:
    下面是我这边下面需要的所有的插件,请大家参考:
    (常规:字体,字号大小,字体颜色,背景色,图片上传,图片复制粘贴等)
    在这里插入图片描述
    点击:Next step 下一步:

    在这里插入图片描述
    3.定制工具,效果及调整:
    将第一排的功能,拖到 第二排,最后会导出第二排的功能插件。
    在这里插入图片描述
    点击 下一步:
    在这里插入图片描述
    4.选择语言:
    选择Chinese,然后点击 下一步:
    在这里插入图片描述
    5.开始【开始生成:定制的功能插件】
    点击:start(开始)
    在这里插入图片描述
    正在生成:
    在这里插入图片描述
    等一会:
    在这里插入图片描述
    6.定制代码生成完成。
    点击【Download your custom CKEditor 5 build】 下载
    找到 刚下载的 zip文件:右击选择 解压到 " ********** "

    7.今天选到这,有时间补充

    展开全文
  • Ckeditor5完全开发指南教程(一)安装篇 欢迎使用Markdown编辑器 本教程重点介绍自定义安装,官方集成版因为功能太少,所以需求不高的,也可以下载官网的集成版和自定义版。 CKEditor5采用的是npm的方式安装插件,...

    Ckeditor5 自定义安装防出错实战教程(一)安装篇

    本教程重点介绍自定义安装,需求不高的,可以下载官网集成版和自定义版(在线生成online-builder)。

    网上很多教程拷贝来拷贝去,不是链接错,就是下载的文件不完整。本篇将解决你的安装烦恼,拒绝踩坑。。。

    CKEditor5采用npm方式安装插件,后续升级方便。

    直奔主题:

    npm安装:
    npm安装方式首先需要安装并配置好node.js环境和git工具
    node.js环境要求: 安装nodejs
    传送门

    https://nodejs.org/zh-cn/
    

    安装好,即可用,绿色解压版的要自己去配置环境变量,这里不多说了。
    下载源码到本地 (cmd 或Git 都可以哪个顺手用哪个吧)
    cmd 省事,如果你安装有GIt 就用Git。

    有人用国内镜象,本人掉坑里很多次。所以建议用官方的不出错,如果下载失败,就关掉命令窗多来几次,,总之,会成功的,相信哥不会错。

    执行下载命令

    git clone -b stable https://github.com/ckeditor/ckeditor5
    

    一、进入文件夹

    执行命令

    cd ckeditor5/packages/ckeditor5-build-classic
    

    安装package.json里面一些项目依赖的包,比如webpack。

    执行命令

    npm install
    

    耐心等待,完成后,接下来开始安装插件

    二、安装插件:

    在这里推荐一些比较常用的插件,
    不需要的插件,直接删除该行命令不执行即可。

    执行命令

    npm install --save @ckeditor/ckeditor5-alignment
    npm install --save @ckeditor/ckeditor5-autosave
    npm install --save @ckeditor/ckeditor5-code-block
    npm install --save @ckeditor/ckeditor5-find-and-replace
    npm install --save @ckeditor/ckeditor5-font
    npm install --save @ckeditor/ckeditor5-highlight
    npm install --save @ckeditor/ckeditor5-horizontal-line
    npm install --save @ckeditor/ckeditor5-markdown-gfm
    npm install --save @ckeditor/ckeditor5-page-break
    npm install --save @ckeditor/ckeditor5-remove-format
    npm install --save @ckeditor/ckeditor5-source-editing
    npm install --save @ckeditor/ckeditor5-special-characters
    npm install --save @ckeditor/ckeditor5-word-count
    

    有的说为什么这么少呢,看别人一堆?其实看过原文件结构你就知道了,大多数插件,默认是已经安装了,只是没有调用,所以没有必要再安装一遍了,起码时间上省了一大半(10分钟)。

    修改文件 直接替换吧:

    ckeditor5-build-classic\src\ckeditor.js
    直接复制下面的内容替换,其它部分自己在编辑器界面调用工具栏按钮。

    /**
     * @license Copyright (c) 2003-2021, CKSource - Frederico Knabben. All rights reserved.
     * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
     */
    
    // The editor creator to use.
    import ClassicEditorBase from '@ckeditor/ckeditor5-editor-classic/src/classiceditor';
    import Essentials from '@ckeditor/ckeditor5-essentials/src/essentials';
    import UploadAdapter from '@ckeditor/ckeditor5-adapter-ckfinder/src/uploadadapter';
    import Autoformat from '@ckeditor/ckeditor5-autoformat/src/autoformat';
    import Bold from '@ckeditor/ckeditor5-basic-styles/src/bold';
    import Italic from '@ckeditor/ckeditor5-basic-styles/src/italic';
    import BlockQuote from '@ckeditor/ckeditor5-block-quote/src/blockquote';
    import CKFinder from '@ckeditor/ckeditor5-ckfinder/src/ckfinder';
    import EasyImage from '@ckeditor/ckeditor5-easy-image/src/easyimage';
    import Heading from '@ckeditor/ckeditor5-heading/src/heading';
    import Image from '@ckeditor/ckeditor5-image/src/image';
    import ImageCaption from '@ckeditor/ckeditor5-image/src/imagecaption';
    import ImageStyle from '@ckeditor/ckeditor5-image/src/imagestyle';
    import ImageToolbar from '@ckeditor/ckeditor5-image/src/imagetoolbar';
    import ImageUpload from '@ckeditor/ckeditor5-image/src/imageupload';
    import Indent from '@ckeditor/ckeditor5-indent/src/indent';
    import Link from '@ckeditor/ckeditor5-link/src/link';
    import List from '@ckeditor/ckeditor5-list/src/list';
    import MediaEmbed from '@ckeditor/ckeditor5-media-embed/src/mediaembed';
    import Paragraph from '@ckeditor/ckeditor5-paragraph/src/paragraph';
    import PasteFromOffice from '@ckeditor/ckeditor5-paste-from-office/src/pastefromoffice';
    import Table from '@ckeditor/ckeditor5-table/src/table';
    import TableToolbar from '@ckeditor/ckeditor5-table/src/tabletoolbar';
    import TextTransformation from '@ckeditor/ckeditor5-typing/src/texttransformation';
    import CloudServices from '@ckeditor/ckeditor5-cloud-services/src/cloudservices';
    
    //加载增加的插件类
    //基本样式类
    import Code from '@ckeditor/ckeditor5-basic-styles/src/code';
    import Strikethrough from '@ckeditor/ckeditor5-basic-styles/src/strikethrough';
    import Subscript from '@ckeditor/ckeditor5-basic-styles/src/subscript';
    import Superscript from '@ckeditor/ckeditor5-basic-styles/src/superscript';
    import Underline from '@ckeditor/ckeditor5-basic-styles/src/underline';
    //字体类
    import Font from '@ckeditor/ckeditor5-font/src/font';
    //文章类
    import Alignment from '@ckeditor/ckeditor5-alignment/src/alignment';
    import CodeBlock from '@ckeditor/ckeditor5-code-block/src/codeblock';
    import Clipboard from '@ckeditor/ckeditor5-clipboard/src/clipboard';
    import FindAndReplace from '@ckeditor/ckeditor5-find-and-replace/src/findandreplace';
    import Highlight from '@ckeditor/ckeditor5-highlight/src/highlight';
    import HorizontalLine from '@ckeditor/ckeditor5-horizontal-line/src/horizontalline';
    import Markdown from '@ckeditor/ckeditor5-markdown-gfm/src/markdown';
    import RemoveFormat from '@ckeditor/ckeditor5-remove-format/src/removeformat';
    import SourceEditing from '@ckeditor/ckeditor5-source-editing/src/sourceediting';
    import PageBreak from '@ckeditor/ckeditor5-page-break/src/pagebreak';
    import WordCount from '@ckeditor/ckeditor5-word-count/src/wordcount';
    //块缩进
    import IndentBlock from '@ckeditor/ckeditor5-indent/src/indentblock';
    //列表类
    import ListStyle from '@ckeditor/ckeditor5-list/src/liststyle';
    import TodoList from '@ckeditor/ckeditor5-list/src/todolist';
    //图片类
    import ImageInsert from '@ckeditor/ckeditor5-image/src/imageinsert';
    import ImageResize from '@ckeditor/ckeditor5-image/src/imageresize';
    import LinkImage from '@ckeditor/ckeditor5-link/src/linkimage';
    //特殊符号类
    import SpecialCharacters from '@ckeditor/ckeditor5-special-characters/src/specialcharacters';
    import SpecialCharactersArrows from '@ckeditor/ckeditor5-special-characters/src/specialcharactersarrows';
    import SpecialCharactersCurrency from '@ckeditor/ckeditor5-special-characters/src/specialcharacterscurrency';
    import SpecialCharactersEssentials from '@ckeditor/ckeditor5-special-characters/src/specialcharactersessentials';
    import SpecialCharactersLatin from '@ckeditor/ckeditor5-special-characters/src/specialcharacterslatin';
    import SpecialCharactersMathematical from '@ckeditor/ckeditor5-special-characters/src/specialcharactersmathematical';
    import SpecialCharactersText from '@ckeditor/ckeditor5-special-characters/src/specialcharacterstext';
    //表格类
    import TableCellProperties from '@ckeditor/ckeditor5-table/src/tablecellproperties';
    import TableProperties from '@ckeditor/ckeditor5-table/src/tableproperties';
    
    // import SimpleUploadAdapter from '@ckeditor/ckeditor5-upload/src/adapters/simpleuploadadapter';
    // import FontFamily from '@ckeditor/ckeditor5-font/src/fontfamily';
    
    export default class ClassicEditor extends ClassicEditorBase {}
    
    // Plugins to include in the build.
    ClassicEditor.builtinPlugins = [
    	//基础
    	BlockQuote,
    	Bold,
    	Code,
    	Essentials,
    	Italic,
    	Strikethrough,
    	Subscript,
    	Superscript,
    	Underline,
    	//文章
    	Alignment,
    	Clipboard,
    	CodeBlock,
    	CloudServices,
    	FindAndReplace,
    	Font,
    	Heading,
    	Highlight,
    	HorizontalLine,
    	Link,
    	//Markdown,
    	RemoveFormat,
    	//RemoveFormatLinks,
    	SourceEditing,
    	PageBreak,
    	PasteFromOffice,
    	Paragraph,
    	WordCount,
    	//缩进
    	Indent,
    	IndentBlock,
    	//列表
    	List,
    	ListStyle,
    	TodoList,
    	//图片
    	Image,
    	ImageCaption,
    	ImageInsert,
    	ImageResize,
    	ImageStyle,
    	ImageToolbar,
    	ImageUpload,
    	LinkImage,
    	//表格
    	Table, 
    	TableToolbar, 
    	TableProperties, 
    	TableCellProperties,
    	//文件
    	CKFinder,
    	EasyImage,
    	MediaEmbed,
    	//SimpleUploadAdapter,
    	UploadAdapter,
    	//特殊符号
    	SpecialCharacters,
        	SpecialCharactersArrows,
        	SpecialCharactersCurrency,
        	SpecialCharactersEssentials,
        	SpecialCharactersLatin,
        	SpecialCharactersMathematical,
        	SpecialCharactersText,
    	//其它
    	Autoformat,
    	
    	TextTransformation,
    
    ];
    
    // Editor configuration.
    ClassicEditor.defaultConfig = {
    	toolbar: {
    		items: [
    			'heading',
    			'|',
    			'bold',
    			'italic',
    			'link',
    			'bulletedList',
    			'numberedList',
    			'|',
    			'outdent',
    			'indent',
    			'|',
    			'uploadImage',
    			'blockQuote',
    			'insertTable',
    			'mediaEmbed',
    			'undo',
    			'redo'
    		]
    	},
    	image: {
    		toolbar: [
    			'imageStyle:inline',
    			'imageStyle:block',
    			'imageStyle:side',
    			'|',
    			'toggleImageCaption',
    			'imageTextAlternative'
    		]
    	},
    	table: {
    		contentToolbar: [
    			'tableColumn',
    			'tableRow',
    			'mergeTableCells'
    		]
    	},
    	// This value must be kept in sync with the language defined in webpack.config.js.
    	language: 'en'
    };
    
    

    ps:要改中文界的话,有两处,一处就是 上面的最后一行代码,en-> zh-cn,另一处就是根目录下webpack.config.js 中 有一处要也要设为zh-cn,如下:

    `language:'zh-cn'`
    

    如果需求不高,简单用用,改了就可以了。

    如果有后续升级或扩展需求的强烈建议不要改。因为每次构建,en是默认语言,而zh-cn有时会有小问题。

    执行以下命令进行编译构建

    npm run build
    

    约1分钟,翻译文件生成了,即大功告成。
    下面加载自选项,打开 packages\ckeditor5-build-classic\sample下的index.html文件,待会就要看这个界面的
    在如下位置添加代码

    1、引入中文语言
    2、在“)”后添加" ,{}" 里面就是自定义的工具栏,加好后内容如下
    在这里插入图片描述
    加好后js代码如下

    <script src="../build/ckeditor.js"></script>
    <script src="../build/translations/zh-cn.js"></script>
    <script>
    	ClassicEditor.create( document.querySelector( '#editor' ),{
    	toolbar: {
    				items: [
    					'sourceEditing',
    					'|','undo','redo',
    					'|','heading',
    					'|','findandReplace','alignment','bold','italic','underline','code',
    					'horizontalLine','removeformat','link','strikethrough','subscript','superscript','blockQuote','specialCharacters',
    					'|','FontSize','FontColor','FontBackgroundColor','FontFamily','highlight',
    					'|','numberedList','bulletedList','todoList','outdent','indent','pageBreak',
    					'|','insertImage','cKFinder','insertTable','mediaEmbed',
    				
    				]
    			},
    			//设置字体
    			fontFamily: {
    				options: [
    					'default',
    					'Blackoak Std',
    					'宋体,SimSun',
    					'新宋体,NSimSun',
    					'微软雅黑,Microsoft YaHei',
    					'楷体_GB2312,KaiTi_GB2312',
    					'隶书,LiSu',
    					'幼园,YouYuan',
    					'华文细黑,STXihei',
    				]
    			},
    			image: {
    
    				styles: [
    					'full','alignLeft', 'alignCenter', 'alignRight'
    				],  
    				resizeOptions: [
    					{
    					name: 'resizeImage:原尺寸',
    					label: '原尺寸',
    					value: null
    					},
    					{
    					name: 'resizeImage:25',
    					label: '25%',
    					value: '25'
    					},
    					{
    					name: 'resizeImage:50',
    					label: '50%',
    					value: '50'
    					},
    					{
    					name: 'resizeImage:75',
    					label: '75%',
    					value: '75'
    					}
    				],
    				toolbar: [
    					// 'imageStyle:full',
    					// 'imageStyle:side',
    					'imageStyle:alignLeft',
    					'imageStyle:alignCenter',
    					'imageStyle:alignRight',
    					'|',
    					'resizeImage', 
    					'|',
    					'toggleImageCaption',
    					'imageTextAlternative',
    					'linkImage'
    				],
    
    			},
    			table: {
    			contentToolbar: [
    			'tableColumn',
    			'tableRow',
    			'mergeTableCells',
    			'tableCellProperties',
    			'tableProperties'
    			]
    			},
    			language: 'zh-cn'
    	} )
    		.then( editor => {
    			window.editor = editor;
    		} )
    		.catch( error => {
    			console.error( 'There was a problem initializing the editor.', error );
    		} );
    </script>
    

    如果一切正常,可以在浏览器中打开文件sample/index.html,以查看插件是否已正确安装。
    界面如下:
    在这里插入图片描述
    好了,开始愉快的玩耍吧,抽空再写一个如何使用ckeditor5 上传文件吧~。。。自己也在学习中,有不对的地方,欢迎留言交流。

    展开全文
  • CKEditor 是著名的 HTML 编辑器,IBM、Oracle、Adobe 等都在用。CKEditor 创建于 2003 年,其前身为 FCKEditor,在 2009 年的时候把“F”去掉了,更名为 CKEditor
  • Java上CKEditor集成指南

    2021-03-03 11:32:03
    系统需求请注意,你至少需要JRE 1.4和Servlet的2.5/JSP 2.1使用整合。安装将CKEditor添加到您的应用程序,有两步的过程:下载独立CKEditor和放置在Web应用程序目录。下载并安装服务器端集成(用于Java CKEditor)。...
  • ckeditor使用教程及开放图片上传接口

    千次阅读 2015-10-06 23:44:43
    一、首先到官网下载最新的ckeditor 获取方式: 1、ckeditor官网下载...二、使用ckeditorckeditor导入到WebRoot目录下 将ckeditor绑定到textarea控件上,同时应用js文件<script type="text/javascript" src="c
  • 在django中,引入django-ckeditor,可以实现后台文章编写的多功能呈现,以及实时预览,在前端相应页面的变量位置...2.个人博客教程版:全程使用,可以把教程中的评论部分,换成自己的文章主体内容即可,效果一样。 ...
  • 昨天看过很多ckeditor 教程,总结了一下用插件最简单的(公司项目用到的是数学公式) 步骤一:在线配置ckeditor,最后下载后复制到项目 步骤二: 新建一个ckeditor 组件,在组件里导入 /bulid/ckeditor 下的js文件,我放到...
  • ckeditor是一款功能很强大的富文本编辑的工具,给我们提供了绝大多数功能,满足我们日常开发所用,但由于特殊情况,可能会需要修改ckeditor的插件。ckeditor提供了给我们很方便扩展插件的接口。最经由于项目的需要,...
  • Java Web基础与实例教程的PPT,自己制作的PPT,将近400页,免费分享,童鞋们努力学习吧。
  • ...ckeditor是一款由javascript编写的富文本网页编辑器,它可以填写文字、插入图片、视频、Excel等富媒体信息,也可以在源码方式下填写内容,在各个网站...下面就来说说ckeditor到底是怎么使用的。 ...
  • > 4、在项目中使用fckeditor $this->load->helper('form_helper'); $data = array( 'name' => 'newsContent', 'id' => 'newsContent', //'toolbarset' => 'Advanced', 'basepath' => $this->config->item('fckeditor...
  • 主要介绍了CKeditor4 字体颜色功能配置方法,结合图文与实例的形式分析了CKeditor4 添加字体颜色扩展功能的相关实现步骤与操作技巧,需要的朋友可以参考下
  • 富文本编辑器CKEditor配置及使用

    万次阅读 多人点赞 2018-03-23 14:53:21
    注:使用CKEditor版本为js版本的CKEditor 4.8.0,所有配置均参考自CKEditor官方API:https://docs.ckeditor.com/,以及实践经验 一、快速使用 CKEditor官网下载js插件 进入官网...
  • 随着CKEditor4.4.1的发布,以前一直困扰的代码高亮问题终于完美的得到解决,在CKEditor4.4中官方发布了Code Snippet这个代码片段的插件,终于可以完美的内嵌使用代码高亮了,以前都是使用网友自己开发的代码高亮插件...
  • 该软件包是教程的最终产品, 教程描述了如何创建“占位符”功能,该功能允许用户将预定义的占位符(例如日期或姓氏)插入文档中。 安装 npm install --save ckeditor5-placeholder 设定档 import ClassicEditor from...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,073
精华内容 429
关键字:

ckeditor使用教程