Magento – WYSIWYG TinyMCE Editor Integration

adminformprototype-jswysiwyg

I have integrated WYSIWYG Editor using this tutorial. I can see it in my custom module, but when I try to insert variable it gives me following error in console

Error: ReferenceError: widgetTools is not defined
Source File: http://mywebsite.com/js/mage/adminhtml/wysiwyg/tiny_mce/plugins/magentowidget/editor_plugin.js
Line: 44

There is also another error when I try to insert widget,

Error: ReferenceError: widgetTools is not defined
Source File: http://mywebsite.com/js/mage/adminhtml/wysiwyg/tiny_mce/plugins/magentowidget/editor_plugin.js
Line: 44

Could anyone pls guide me on how to integrate WYSIWYG editor in backend custom module as well as frontend without having console errors.

Also how to add necessary WYSIWYG (TinyMCE) JS files to insert widgets, variables, images and other media types ?

Thanks.

Best Answer

You will need to include the wysiwyg javascript files.

I think the lines of code you need are.

<script type="text/javascript" src="<?php echo $this->getJsUrl() ?>tiny_mce/tiny_mce.js"></script>

And

<action method="addItem"><type>js</type><name>mage/adminhtml/wysiwyg/tiny_mce/setup.js</name><params/><if/><condition>can_load_tiny_mce</condition></action>

These should be set by default on normal adminhtml pages as long as you turn on the editor. To do this you can add the following to your block class in the _prepareLayout function.

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