Read More
Read More
Menu Close

    How to Get WYSIWYG Editor on Admin Forms in Magento 2


    Today, we will see how to add wysiwyg editor on Admin Forms. Sometimes it is required to add the wysiwyg editor to collect data from the user. WYSIWYG editor is Magento 2 default editor so we dont need to install its library, its already available.

    Lets start the coding part:

    My module directory is as such:


    Searching for an experienced
    Magento Company ?
    Read More

    Content of Form.php

    class Form extends \Magento\Backend\Block\Widget\Form\Generic
         * @var \Magento\Cms\Model\Wysiwyg\Config
        protected $_wysiwygConfig;
         * @var \Magento\Store\Model\System\Store
        protected $_systemStore;
         * @param \Magento\Backend\Block\Template\Context $context
         * @param \Magento\Framework\Registry $registry
         * @param \Magento\Framework\Data\FormFactory $formFactory
         * @param \Magento\Store\Model\System\Store $systemStore
         * @param array $data
        public function __construct(
            \Magento\Backend\Block\Template\Context $context,
            \Magento\Framework\Registry $registry,
            \Magento\Framework\Data\FormFactory $formFactory,
            \Magento\Store\Model\System\Store $systemStore,
            \Magento\Cms\Model\Wysiwyg\Config $wysiwygConfig, //in your constructor pass the following argument
            array $data = []
        ) {
            $this->_wysiwygConfig = $wysiwygConfig;
            $this->_systemStore = $systemStore;
            parent::__construct($context, $registry, $formFactory, $data);
         * Init form
         * @return void
        protected function _construct()
            $this->setTitle(__('Wysiwyg Editor'));
         * Prepare form
         * @return $this
        protected function _prepareForm()
            $form = $this->_formFactory->create(
                ['data' => [
                            'id' => 'edit_form',
                            'enctype' => 'multipart/form-data',
                            'action' => $this->getData('action'),
                            'method' => 'post']
            $fieldset = $form->addFieldset(
                ['legend' => __('Wysiwyg Editor'), 'class' => 'fieldset-wide']
            //in your form the wysiwyg field will be like this
                    'name' => 'body',
                    'label' => __('Content'),
                    'title' => __('Content'),
                    'style' => 'height:10em',
                    'required' => true,
                    'config' => $this->_wysiwygConfig->getConfig()
            return parent::_prepareForm();

    That’s it just, you will we able to get the editor in your form. Now, we will see How to get this WYSIWYG field content in my next post.

    If you have any query please comment below. Thanks 🙂

    . . .
    Discuss on Helpdesk

    Leave a Comment

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


  • sachin arora
    Hello can you please tell me complete code , so that i can use it for Marketing->Email Template.

    Please Reply ASAP

  • Back to Top