ckeditor-基于div的编辑器 [英] ckeditor - div based editor

问题描述

我想使用ckeditor为我的网站创建一个可编辑区域。这个可编辑区域必须像ckeditor一样显示html格式的元素，再加上我希望字体和颜色与我的网站样式相匹配。

I would like to create an editable area for my website using ckeditor. This editable area must show html formatted elements like ckeditor does, plus i would like that fonts and colors match the styles of my website.

解决方案似乎非常简单，我可以使用内联编辑编写如下内容：

The solution seems to be very simple, I could use the inline editing writing something like this:

<script type="text/javascript" src="ckeditor.js"></script>
<div contenteditable="true">my content...</div>

它可以工作，但是我不需要什么：如果div出现，编辑器就会消失元素是否具有焦点。但是，我想随时显示编辑器！

It works but there is something that I don't need: the editor appears and disappears if the div element has the focus or not. But, I want to show the editor every moment!

这似乎只能替换textarea（阅读所有其他论坛），但是可以替换textareas与我的网站样式表不匹配！

That seems to be possible only replacing a textarea (reading all other forums) but textareas don't match my website stylesheets!

经过一些搜索，我在ckeditor的网站上看到了以下示例： http://ckeditor.com/demo#div

After some searching I saw this example on ckeditor's website: http://ckeditor.com/demo#div

这正是我所需要的！！！永远不会消失的在线编辑器！

It is exactly what I need!!! An inline-editor that never disappears!

问题是：

我对代码，我不明白让这样的编辑器使用的基本代码是什么！您能帮我吗？

I'm not so able with the code, I can't understand what is the basic code to make the editor like that! Can you help me please?

推荐答案

我在Google上搜索了此处！

I've googled it here!

您需要分区插件：下载页面。

安装后此插件，您应该使用以下命令启动编辑器：

After installing this plugin, you should launch editor with it like this:

<script>CKEDITOR.replace('my_text_area', { extraPlugins : 'divarea' });</script>

或者您可以在CKEditor的 config.js ：

or you can add plugin in CKEditor's config.js:

CKEDITOR.editorConfig = function( config ) {
    config.extraPlugins = 'divarea'
};

希望它会有所帮助（应该！）

Hope it helps (it should!)

这篇关于ckeditor-基于div的编辑器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！