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):






protected function _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 How to use WYSIWYG editor (TinyMCE) in custom Admin Magento Module Reviewed by Web Technology Funda on 11:22:00 PM Rating: 5

No comments

Free! Free!Free! Subscribe to Get Free PHP (Magento) tutorial Update in Your Inbox!!! Hurry Up!!!