Question

使用CKeditor我想提供一种从组合框或类似工具中插入少量html代码的简单方法。这可能没有插件，或者是否有现有的插件？

示例：

Toolbar:[ ][ ] [comboBox] 
               |article image         | => (inserts <img src="aimage/{{id}}"/>
               |full-width-2col-table | => (inserts <table width="100%"><tr>..

（{{id}}将被ajax取代，但这是另一个故事...）

的问候，

Answer 1

几天前我正在研究一个类似的问题，所以我删除了一个插件。

在CK插件目录中创建名为“myinsert”的文件夹。创建一个名为plugin.js的文件，并将以下内容粘贴到其中：

CKEDITOR.plugins.add( 'myinsert',
{
init: function( editor )
{
    editor.addCommand( 'insertMycode',
        {
            exec : function( editor )
            {    
                var timestamp = new Date();
                editor.insertHtml( 'Some Code Here.' );
            }
        });


    editor.ui.addButton( 'Mycode',
    {
        label: 'Insert Timestamp',
        command: 'insertMycode',
        icon: this.path + 'tag.gif'
    } );
}
} );

您必须在该目录中包含一个图标，否则该按钮将无法正常显示。

接下来，在您的脚本中调用您的编辑器，放置它：extraPlugins : 'myinsert', 例如：

<script type="text/javascript">
CKEDITOR.replace( 'editor1', {
    extraPlugins : 'myinsert',
    toolbar : 'EditPost',
    uiColor : '#BBB',   
}); 
</script>

然后只需将功能名称添加到工具栏设置中，无论它在哪里。

    { name: 'tools', items : [ 'Maximize', 'ShowBlocks','-','About', 'Mycode' ] }

如果您重命名该功能或文件夹，只需确保它们必须是同一个名称。此外，您放在工具栏上的名称必须与editor.ui.addButton()

中的名称相匹配

ckeditor插件的代码片段？

1 个答案: