On EE 1.12, I would like to update to the latest version of tiny MCE.

This is to make use of some updated plugins (non-editable areas etc)

Seems like it is not just a drop-in replacement.

Once droped in the js folder and I adjusted head.phtml to load the new version, I get js error, and no tiny mce editor :(

<?php if($this->getCanLoadTinyMce()): // TinyMCE is broken when loaded through index.php ?>
<script type="text/javascript" src="<?php echo $this->getJsUrl() ?>tiny_mce_new/tinymce.min.js"></script>
<?php endif; ?>

I am hoping someone has a resource available, or done this before and know how to fix this - no time to dig, on a strict deadline on this project :(

Help appreciated.

enter image description here


Ok, I had to solve this one myself.

Found : http://www.tinymce.com/wiki.php/Tutorial:Migration_guide_from_3.x

and from that :

TinyMCE 4.0 has a new way of binding events. Instead of the old dispatcher method it uses the more common "on" and "off" like for example jQuery. It also allows you to bind multiple events and cancel events using the more common preventDefault and stopPropagation. Check the API documentation for a full list of events.

Note: this is a WIP, this does not solve the integration issue of TinyMCE4, but it answers the question, and gets it a step closer. Magento custom modules are broke, and will need further work. I hope to be able to release a module (not soon, I am very busy at the moment) to enable integration.

The following code in the js/mage/adminhtml/wysiwyg/tiny_mce/setup.js makes it work. (changes to event handlers binding). Warning this is editing a core file, and is BAD. This is WIP to be modularized when I figure it all out, so don't go edit your core files if you read this!

setup : function(ed) {
                  ed.on('submit', function(e) {
                    varienGlobalEvents.fireEvent('tinymceSubmit', e);
                  ed.on('change', function(e) {
                    varienGlobalEvents.fireEvent('tinymceChange', e);
                  ed.on('paste', function(e) {
                    varienGlobalEvents.fireEvent('tinymcePaste', e);

                  ed.on('BeforeSetContent', function(e) {
                    varienGlobalEvents.fireEvent('tinymceBeforeSetContent', e);
                  ed.on('SetContent', function(e) {
                    varienGlobalEvents.fireEvent('tinymceSetContent', e);
                  ed.on('SaveContent', function(e) {
                    varienGlobalEvents.fireEvent('tinymceSaveContent', e);
                  ed.on('ExecCommand', function(e) {
                    varienGlobalEvents.fireEvent('tinymceExecCommand', e);
  • 1
    @ProxlBlue Possibly relevant to your interests: I wrote an article a few weeks ago that outlines how to "live patch" Magento's TinyMCE javascript. You could probalby do something similar here to avoid the core changes. alanstorm.com/magento_html5_tinymce
    – Alan Storm
    Aug 22 '13 at 18:46
  • @AlanStorm Thanks for that. Had actually come across your post during investigations. Doing some proof of concept at the moment for functionality (making areas in the cms html editable, as content editors muck up the underlying html, when in wysiwyg mode). Unfortunately upgrading tiny_mce did not give me what I wanted (was hoping the mceEditable/mceNonEditable plugin would do the trick). Have abandoned the idea/concept of using tiny_mce, and working on another (which is looking a lot more promising) Looking at using snapeditor.com as a means to allow the required editing.
    – ProxiBlue
    Aug 23 '13 at 1:30

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.