Skip to content

Adding TinyMce EDitor in Magento 2 through Phtmls

<script type="text/javascript">
        require([
            'jquery',
            'mage/adminhtml/events',
            'mage/adminhtml/wysiwyg/tiny_mce/setup'
        ], function (jQuery) {
            jQuery(document).ready(function () {
                var editor;

                editor = new wysiwygSetup(
                    'additional-description',{
                        "width":"99%",
                        "height":"200px",
                        "plugins":[{"name":"image"}],
                        "tinymce4":{"toolbar":"formatselect | bold italic underline | alignleft aligncenter alignright | bullist numlist | link table charmap","plugins":"advlist autolink lists link charmap media noneditable table contextmenu paste code help table",
                        }
                    });

                editor.setup("exact");
                jQuery('#additional-description')
                    .addClass('wysiwyg-editor')
                    .data(
                        'wysiwygEditor',
                        editor
                    );
  });
        });
  <div class="field additional-description"><label class="label" for="additional-description"><span>Product
                Description</span><br><span class="scope">[global]</span></label>
            <div class="control _with-tooltip"><textarea id="additional-description" <?= strpos($current_url, 'view') ? ' disabled="disabled"' : '';?> class="input-text" 
                name="additional[description]" placeholder=""><?= $additionalAttributes['description'] ? trim($additionalAttributes['description']) : null ?></textarea>
                <div class="field-tooltip toggle"><span class="field-tooltip-action action-help" tabindex="0"></span>
                    <div class="field-tooltip-content"><span>Product Description</span></div>
                </div>
            </div>
        </div>