While developing the new Fontis Blog extension, we wanted to allow use of the same WYSIWYG editor tools that users have when creating Magento CMS pages or static blocks. Doing so is not very difficult, requiring only a few changes to add the Magento WYSIWYG to your own extensions.
<reference name="head"> <action method="setCanLoadTinyMce"><flag>1</flag></action> </reference>
The second step is to set a couple of attributes for each
field on your page that you wish to have the WYSIWYG editor. For each
field that you have on your page, you'll have a call to
$fieldset->addField() with a few configuration
options. Most fields will have the "name", "label", "title", "style" and "required"
options set. To enable the WYSIWYG editor for a specific field, you'll need
to add the following two options:
- wysiwyg — set this to true
config — make a call to
Mage::getSingleton("cms/wysiwyg_config")->getConfig()and assign the result to this
This will be enough to get the WYSIWYG editor working, but there are still some additional steps required to get it working as you'd expect.
When you make the call to
you can specify a few defaults. To do so, you create an array with these
defaults and pass it as a parameter to
getConfig(), like so:
Mage::getSingleton("cms/wysiwyg_config")->getConfig(array( "add_variables" => true, "add_widgets" => true, "add_images" => true, );
These settings control the visibility of the "Add Variables", "Add Widgets" and
"Add Images" buttons when the WYSIWYG editor is hidden. It is also worth noting that
if the WYSIWYG editor is disabled completely, the "Add Images" button will not show
up even if set to
true unless either
add_widgets (or both) are set to
Next, in order for the Magento WYSIWYG image gallery to actually appear, you need to add
<update handle="editor"/> to the relevant layout XML.
<adminhtml_blog_blog_edit> <update handle="editor"/> </adminhtml_blog_blog_edit>
Lastly, don't forget to put the text the user entered through Magento's CMS processor before the text is output to the browser. This ensures the CMS tags inserted by the WYSIWYG editor are parsed and replaced by actual markup. This is done with a call to the following function:
$processedContent = Mage::helper("cms")->getPageTemplateProcessor()->filter($unprocessedContent);
Following the above process should allow your extension to provide admins with the familiar Magento WYSIWYG editor on a text field of your choosing, making it easy for them to manage rich content on their site.