Rich text editor in Zope 3 using FCKEditor
Zope 3 doesn't have a built in rich text editor, but that doesn't mean that it's not easy to integrate one in your application. There are already packages available on svn.zope.org that integrate FCKEditor and TinyMCE with Zope, so all it's left is to tie the pieces together. You can find some pointers on how to integrate TinyMCE here (although there's also the Zope-TinyMCE integrated package), so I'll just cover FCKEditor. First, you'll have to install zope.html, zope.file and zope.mimetype from svn.zope.org. zope.html will make several new Field types available, so you can do something like this in your schema:
from zope.html.field import HtmlFragmentThat's all it's needed, basically. Further, I like a more streamlined editor. so I subclass the FCKEditor widget to provide some better defaults:
class IActivity(Interface):
instructions = HtmlFragment(title=_("Instructions"))
class FCKSimpleEditor(FckeditorWidget):
toolbarConfiguration = "Basic"
editorWidth = 400
editorHeight = 200
And register this widget as default for IText fields (I'm registering the widget for a IMySiteLayer skin layer):
<!-- Use a simplified fckeditor -->
<zope:view for="zope.html.field.IHtmlFragmentField"
provides="zope.app.form.interfaces.IInputWidget"
factory=".widgets.FCKSimpleEditor" permission="zope.Public"
type=".IMySiteLayer" />
To display those IText fields as "structured" text, by default, I've created a stupid HTML widget:
class HtmlDisplayWidget(DisplayWidget):
def __call__(self):
return renderElement("div", contents=self._data)
which is registered with:
<!-- properly display html fields -->Note: if you're trying to load the FCKEditor in ajax loaded views, you'll encounter some problems. Click for solution.
<zope:view type=".IMySiteLayer" for="zope.schema.Text"
provides="zope.app.form.interfaces.IDisplayWidget"
factory=".widgets.HtmlDisplayWidget" permission="zope.Public" />