Magento 2 – Disable WYSIWYG editor only for the pages and static blocks.

The WYSIWYG editor is a good way to show the design preview in Magento 2. It is useful most of the time. But I go through some issues when I use huge HTML markup. It causes some extra white spaces and removes few tags too. So, the design goes broken.

To address this issue, disabling the WYSIWYG editor for pages and blocks helps me a lot. Today I am going to share the workaround with you.

For any cases, If you want to disable the editor completely. You do not need to follow the whole tutorial here. Simply you can go to the following path and select the “Disable Completely” option from the dropdown menu.

Go to: Admin panel > Stores > Configuration > General > Content Management > Enable WYSIWYG Editor

Here is the coding part begins, to disable the WYSIWYG editor only for the static blocks and pages, you need to create a small module. To do so, please follow the few steps below.

Step 1: Register the module.

app/code/MilanDev/Demo/etc/module.xml

<?xml version="1.0" ?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
	<module name="MilanDev_Demo">
		<sequence>
			<module name="Magento_Cms"/>
		</sequence>
	</module>
</config>

app/code/MilanDev/Demo/registration.php

<?php
use Magento\Framework\Component\ComponentRegistrar;

ComponentRegistrar::register(ComponentRegistrar::MODULE, 'MilanDev_Demo', __DIR__);

Step 2: Implement the logics

To implement this logic you need to customize the IsEnabled method into the Magento\Cms\Model\Wysiwyg\Config class. To do so, you need to use Magento 2 plugins system. If you are not aware of the Magento 2 plugins you should check it out on their official docs.

In short, Plugins allow you to extend or change the behavior of Magento without changing the original classes.

Here, I register my own plugin class MilanDev\Demo\Plugin\Backend\Magento\Cms\Model\Wysiwyg\Config in the di.xml file and implemented the logics.

app/code/MilanDev/Demo/etc/adminhtml/di.xml

<?xml version="1.0" ?>
<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="MilanDev_Demo_Plugin_Backend_Magento_Cms_Model_Wysiwyg_Config" 
			type="MilanDev\Demo\Plugin\Backend\Magento\Cms\Model\Wysiwyg\Config" sortOrder="10" disabled="false"/>
	</type>
</config>

app/code/MilanDev/Demo/Plugin/Backend/Magento/Cms/Model/Wysiwyg/Config.php

<?php
declare(strict_types=1);

namespace MilanDev\Demo\Plugin\Backend\Magento\Cms\Model\Wysiwyg;

class Config
{
    protected $request;

    public function __construct(
        \Magento\Framework\App\Request\Http $request
    ){
        $this->request = $request;
    }

    public function afterIsEnabled(
        \Magento\Cms\Model\Wysiwyg\Config $subject,
        $result
    )
    {
        $moduleName = $this->request->getModuleName();
        
        if ($moduleName === 'cms') {
            return false;
        }
        return $result;
    }
}


After doing all the steps above please run the necessary commands to clean caches and generate dependency classes.

If you know any other ways to address this issue or have any opinions please feel free to comment below. Happy Coding.

Leave a Reply

Your email address will not be published. Required fields are marked *