How to create Magento 2 Product Attribute with Wysiwyg editor Programmatically.

  • please check my answer and update me.
    – Msquare
    Jul 1, 2020 at 8:34

4 Answers 4


Latest Magento version 2.3 provides the "Text Editor" Catalog Input Type for Store Owner So please go to Store->Attributes->Product and add the New product attribute with the Catalog Input Type "Text Editor".

enter image description here

I hope this is helpful to you!!


Please follow below steps to create a custom product attribute and add it as WYSIWYG Editor in Product form.

Step 1 : Create custom attribute through Install Script.

Below is an example of install script.




namespace VendoreName\ModuleName\Setup;

use Magento\Eav\Model\Entity\Attribute\ScopedAttributeInterface;
use Magento\Eav\Model\Entity\Attribute\Source\Boolean;
use Magento\Eav\Setup\EavSetupFactory;
use Magento\Framework\Setup\InstallDataInterface;
use Magento\Framework\Setup\ModuleContextInterface;
use Magento\Framework\Setup\ModuleDataSetupInterface;

class InstallData implements InstallDataInterface
    private $eavSetupFactory;

    public function __construct(EavSetupFactory $eavSetupFactory)
        $this->eavSetupFactory = $eavSetupFactory;
    public function install(ModuleDataSetupInterface $setup, ModuleContextInterface $context)
        $eavSetup = $this->eavSetupFactory->create(['setup' => $setup]);
                'type' => 'text',
                'backend' => '',
                'frontend' => '',
                'label' => 'Editor content',
                'input' => 'textarea',
                'class' => '',
                'source' => '',
                'backend' => 'Magento\Eav\Model\Entity\Attribute\Backend\ArrayBackend',
                'global' => \Magento\Catalog\Model\ResourceModel\Eav\Attribute::SCOPE_GLOBAL,
                'visible' => true,
                'required' => false,
                'user_defined' => false,
                'default' => 0,
                'searchable' => false,
                'filterable' => true,
                'comparable' => false,
                'visible_on_front' => true,
                'used_in_product_listing' => true,
                'is_wysiwyg_enabled'      => TRUE,
                'unique' => false,
                'apply_to' => ''

Run php bin/magento setup:upgrade console command to upgrade your data. Now you custom attribute will be created.

Step 2 : Add the Custom attribute in Category Form with WYSIWYG Editor



<?xml version="1.0" encoding="UTF-8"?>
<form xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    <fieldset name="content">
        <field name="editor_content" template="ui/form/field" sortOrder="10" formElement="wysiwyg">
            <argument name="data" xsi:type="array">
                <item name="config" xsi:type="array">
                    <item name="wysiwygConfigData" xsi:type="array">
                        <item name="settings" xsi:type="array">
                            <item name="theme_advanced_buttons1" xsi:type="string">bold,italic,|,justifyleft,justifycenter,justifyright,|,fontselect,fontsizeselect,|,forecolor,backcolor,|,link,unlink,image,|,bullist,numlist,|,code</item>
                            <item name="theme_advanced_buttons2" xsi:type="boolean">false</item>
                            <item name="theme_advanced_buttons3" xsi:type="boolean">false</item>
                            <item name="theme_advanced_buttons4" xsi:type="boolean">false</item>
                            <item name="theme_advanced_statusbar_location" xsi:type="boolean">false</item>
                        <item name="height" xsi:type="string">10px</item>
                        <item name="toggle_button" xsi:type="boolean">false</item>
                        <item name="add_variables" xsi:type="boolean">true</item>
                        <item name="add_widgets" xsi:type="boolean">false</item>
                        <item name="add_images" xsi:type="boolean">true</item>
                        <item name="add_directives" xsi:type="boolean">true</item>
                    <item name="source" xsi:type="string">category</item>
                <scopeLabel>[STORE VIEW]</scopeLabel>
                <label translate="true">Editor Content</label>
                <wysiwyg class="Magento\Catalog\Ui\Component\Category\Form\Element\Wysiwyg">

Run Command

php bin/magento s:up
php bin/magento c:c
php bin/magento c:f

Now you can see you custom editor attribute in Admin product form.

I Hope This helps You.


The above answer worked, but it is showing two times , one is text area and one is Wysiwyg. After add some content in that but not visible in product detail page.


The answer shared by Msquare is indeed correct but there are some small issues. First in the InstallData.php file which creates the attribute

is_wysiwyg_enabled => true,

should be changed to

wysiwyg_enabled => true,

Even though the column name in the catalog_eav_attribute is is_wysiwyg_enabled, the correct name to use in the setup scripts is wysiwyg_enabled. Magento internally maps the field from the setup script to the database column. A full list of mappings can be found here.

Next thing is, you don't actually need the product_form.xml file. Since the 'visible' => true, field was used in the setup script, the field will automatically appear in the product form in the general information section as a WYSIWYG editor. If you add the xml file, you will find the field repeated twice. Furthermore, if you change to 'visible' => false,, only 1 field will remain but it will not load the value of the field from the database.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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