Event Observer – Hook into Image Upload Function on WYSIWYG Editor

event-observerimage-uploadoverridesuploadwysiwyg

I'm trying to trigger a function after an image has been uploaded using the wysiwyg editor but I don't think an events is fired after this operation. I know it's relatively easy to do so when you upload product images to the catalog but not so much when adding images to cms pages or static blocks.

I think the uploadFile function in the Mage_Cms_Model_Wysiwyg_Images_Storage class is responsible for this so I guess I could override it in my module but I was wondering if there was a cleaner way to do it.

Best Answer

Following these instructions I was able to log all the events that fire when you upload an image in the cms pages but sadly there is none that let's you hook into specifically to handle the uploaded image.

The closes one I found was controller_action_predispatch_adminhtml_cms_wysiwyg_images_thumbnail and controller_action_postdispatch_adminhtml_cms_wysiwyg_images_thumbnail but these run when the thumbnails in the image upload modal are rendered.

I guess overriding the Mage_Cms_Model_Wysiwyg_Images_Storage class is the way to go here.

Related Solutions

Magento 1.9 WYSIWYG Editor Deleting HTML Code in Static Block – Fix Guide

I am also having an issue with Magento deleting code, although it seems the cause may be different and I have a work-around. The code in question is:

<div id="mqnb_main">
    <a id="mqnb_link" href="#specials_element" onmouseup="mqnbCheck()"><span class="ci_if_linkspan"><p id="mqnb_text">View<br/>Specials</p></span></a>
</div>

...which gets turned into:

<div id="mqnb_main">
    <p id="mqnb_text">View<br/>Specials</p>
</div>

I don't have full access to Magento, so my only recourse (after sending an ineffectual email) was to use JavaScript to make sure the elements were all there. I added this at the end of the static block:

<script type="text/javascript">
    document.getElementById("mqnb_main").innerHTML = '<a id="mqnb_link" href="#specials_element" onmouseup="mqnbCheck()"><span class="ci_if_linkspan"><p id="mqnb_text">View<br/>Specials</p></span></a>';
</script>

Magento – Magento 2 WYSIWYG Media image directive using admin url

This is a known bug which is still present in CE 2.1.5.

The known fix is to add 'add_directives' => true to getConfig function ofvendor/magento/module-cms/Model/Wysiwyg/Config.php.

The best way to do that is to write an interceptor.

In your custom Magento 2 extension's etc/di.xml file:

<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:ObjectManager/etc/config.xsd">
  <type name="Magento\Cms\Model\Wysiwyg\Config">
   <plugin name="add_wysiwyg_data" type="Vendor\Module\Plugin\WysiwygConfig" sortOrder="30" />
  </type>
</config>

Vendor\Module\Plugin\WysiwygConfig.php:

namespace Vendor\Module\Plugin;

class WysiwygConfig
{
 public function afterGetConfig($subject, \Magento\Framework\DataObject $config)
 {
   $config->addData([
    'add_directives' => true,
   ]);

   return $config;
 }
}

Install it php bin/magento setup:upgrade
Important: after installation you need to re-edit the affected category descriptions and re-upload images.

Idea of this fix extension is not mine but this guy. He also packed it all up on github for you to download.

I tested it myself on CE 2.1.4 and it works fine.

Best Answer

Related Solutions

Magento 1.9 WYSIWYG Editor Deleting HTML Code in Static Block – Fix Guide

Magento – Magento 2 WYSIWYG Media image directive using admin url

Related Topic