`

ckeditor简单插件(非dialog)

阅读更多

在CKEditor目录下有专门放插件的目录plugins,我们也把插件放这个目录下,新建一个文件夹pagination,然后在这个目录下新建一个文件plugin.js,输入下面内容:

CKEDITOR.plugins.add('pagination',{
    init: function(editor) {           
		var pluginName = 'pagination';    
		editor.addCommand(pluginName,{exec:function(editor){editor.insertHtml("[NextPage]")}});
        editor.ui.addButton('pagination', {                  
            label: '分页',   
            command: pluginName   
        });
    }
});

 打开skins\kama\editor.css,加入以下代码:

.cke_skin_kama .cke_button_pagination .cke_icon{background:url(images/pagination.gif);} 

在skins\kama\images目录下加上pagination.gif图片

 

然后,我们在ckeditor\config.js里注册这个插件,就能看到了。打开ckeditor\config.js,添加下面代码:

CKEDITOR.editorConfig = function( config )  
{  
    // Define changes to default configuration here. For example:  
    // config.language = 'fr';  
    // config.uiColor = '#AADC6E';  
    config.toolbar = 'MyToolbar';  
 
    config.toolbar_MyToolbar =  
    [  
        ['Source','-','Save','NewPage','Preview','-','Templates'],  
        ['Cut','Copy','Paste','PasteText','PasteFromWord','-','Print', 'SpellChecker', 'Scayt'],  
        ['Undo','Redo','-','Find','Replace','-','SelectAll','RemoveFormat'],  
        ['Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField'],  
        '/',  
        ['Bold','Italic','Underline','Strike','-','Subscript','Superscript'],  
        ['NumberedList','BulletedList','-','Outdent','Indent','Blockquote'],  
        ['JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'],  
        ['Link','Unlink','Anchor'],  
        ['Image','Flash','flvPlayer','Table','HorizontalRule','Smiley','SpecialChar','PageBreak'],  
        '/',  
        ['Styles','Format','Font','FontSize'],  
        ['TextColor','BGColor'],  
        ['Maximize', 'ShowBlocks','-','About']  
          
    ];  
    config.extraPlugins = 'pagination';  
 
}; 

 

分享到:
评论

相关推荐

    Ckeditor自定义插件

    CKeditor 自定义插件 需求:我需要在编辑文本的时候,选择一段文字,点击自定义的按钮,就能够在这段文字后面增加一个图标,图标超链接去一个地址,以选中的文字作为参数。

    ckeditor插件工具

    ckeditor插件工具,ckeditor插件工具,ckeditor插件工具,ckeditor插件工具,

    ckeditor4 行高插件

    本插件源码来自互联网,由于源代码基于ckeditor3.6.61,故对源码进行过简单修改,以求适应ckeditor4.4.7

    ckeditor 自动排版插件

    ckeditor 自动排版插件 本插件下载解压后直接放plugins目录下,怎么添加到ckeditor的按钮里就不用我说的吧

    CKEditor 4.0 行距插件lineheight

    用于最新CKEditor4.0的行距插件,不能用于CKEditor3.X.X及以前版本

    CKEditor 添加Video插件(MP4,MP3)并且兼容HTML5 Video插件

    CKEditor 添加Video插件(MP4)并且兼容HTML5 Video插件 1:把video文件复制到ckeditor/plugins/下面 2:ckeditor/config.js 中添加如下: a:在toolbar中['Image','Flash','Video'],配置加入“Video” 项。 b:配置 ...

    ckeditor 行间距插件

    ckeditor 行间距插件

    CKEditor插件开发

    CKEditor插件开发

    ckeditor onchange 事件插件

    ckeditor onchange 事件插件

    ckeditor 4代码插件

    ckeditor 4 代码插件安装 主页:wudimei.com 安装 把plugins复制到ckeditor目录中,注意是ckeditor4. 修改ckeditor/config.js,加入如下代码: CKEDITOR.editorConfig = function( config ) { // Define changes ...

    ckeditor设置行间距插件包

    ckeditor设置行间距资源包 1.下载ckeditor的行距插件包 lineheight 2.解压到ckeditor/plugins目录下 3.修改ckeditor目录下的 config.js文件

    CKEditor FLV视频播放插件

    FLV视频格式具有本身占有率低、视频质量良好、体积小等特点,非常适合在网络上传播。国内的视频站几乎都是采用FLV格式作为解决方案...于是我自己动手开发CKEditor的FLV视频播放插件现在上传。PS:这个版本是.net版的。

    ckeditor4添加上传视频插件

    ckeditor4添加上传视频插件 后端java配置看下面的链接 https://blog.csdn.net/sxz13145/article/details/124410416

    ckeditor自定义插件

    NULL 博文链接:https://kingj.iteye.com/blog/1700931

    ckeditor行间距插件

    ckeditor行间距插件包,解决ckeditor没有行间距的问题

    CKeditor富文本编辑器插件资源

    CKeditor富文本编辑器插件资源,让你像word一样的简单操作

    最新ckeditor行距插件lineheight

    适用于ckeditor4.0以上,使用方法: 1.将lineheight文件夹拷入plugins文件夹下 2.修改config文件加入config.extraPlugins += (config.extraPlugins ? ',lineheight' : 'lineheight'); 语句用来加载插件

    CKEditor4的代码编辑插件增强版

    CKEditor4是一个所见即所得的在线富文本编辑控件,有众多的插件支持。codesnippet是一个代码编辑的插件,但功能有限,只能支持一种主题风格的显示,而且代码编辑时是用普通的文本框,视觉效果极差。本插件在code...

    非常全面的CKEditor插件开发文档

    CKEditor插件开发文档,内容丰富,包括插件的完整流程

    ckeditor5-plugins:自定义ckeditor5插件(例如

    CKEditor5-plugins基于ckeditor5的,适用于自定义构建的插件包。要使用此插件包,则不建议直接使用官方的classic、document、inline、balloon等构建,建议自定义构建features 包含功能├── src│ ├── clear-...

Global site tag (gtag.js) - Google Analytics