How to use WYSIWYG editor (TinyMCE) in custom Admin Magento Module

Rich text editor(TinyMCE) is an often requirement for Admin Module as it makes the content editing work much more easier.
In order to enable TinyMCE editor in textarea field, You need to do the following two things:

1> Including TincyMCE in Head

Add the following function in your Adminhtml Edit Class (MagePsycho_Demomodule_Block_Adminhtml_Demomodule_Edit):

protectedfunction_prepareLayout() {

parent::_prepareLayout();

if(Mage::getSingleton('cms/wysiwyg_config')->isEnabled()) {

$this->getLayout()->getBlock('head')->setCanLoadTinyMce(true);

}

}

2> Enabling in Form Field

Add the following content field in your Adminhtml Form class (MagePsycho_Demomodule_Block_Adminhtml_Demomodule_Edit_Tab_Form):

$fieldset->addField('content', 'editor', array(

'name'=> 'content',

'label'=> Mage::helper('demomodule')->__('Content'),

'title'=> Mage::helper('demomodule')->__('Content'),

'style'=> 'height:15em',

'config'=> Mage::getSingleton('cms/wysiwyg_config')->getConfig(),

'wysiwyg'=> true,

'required'=> false,

));

Note: Field Type must be ‘editor’ and ‘wysiwyg’ must be true

3> That’s All.

Here is what it looks like when loaded:

TinyMCE Editor

Note 1) that this code was tested in Magento Version 1.6.1.0 2) If you have any display related issue then change the name and id "content" to "news_content".

Happy Editing!

Note: This article is originally taken from site "http://www.blog.magepsycho.com/category/javascript/"

How to use WYSIWYG editor (TinyMCE) in custom Admin Magento Module
Reviewed by Pranay Gondane
on
11:22:00 PM
Rating: 5