当我调用tinymce.init时，WordPresspress tinymce编辑器会发生变化

Question

I am trying to set the content of a tinymce editor in a plugin and I can change the content but the appearance of the editor changes when I use this code

jQuery(document).ready(function($) {
var name1 = "wprsspostprepend";
if($("#" + name1).length > 0) {

  tinyMCE.init({
    selector : "#wprsspostprepend",
     setup: function (editor) {
    editor.on('init', function () {
      var selector = tinyMCE.get('wprsspostprepend');
      var content =  selector.getContent();
   selector.setContent("<div id='random-wrap'>" + content + "</div>");
    });
  }
});

}


 });

I lose all the Wordpress plugin icons from the menu bar and it changes to just a stock editor.

How can I set the content of the editor without changing the appearance?

Answer 1

I'd imagine that this is due to you prepending everything to the content including the content itself.

Try something like this;

jQuery(document).ready(function($) {
    var name1 = "wprsspostprepend";
    if($("#" + name1).length > 0) {
        tinyMCE.init({
            selector : "#wprsspostprepend",
            setup: function (editor) {
                editor.on('init', function () {
                    var pre = tinyMCE.get('wprsspostprepend');
                    var content = pre.getContent();
                    selector.setContent("<div id='random-wrap'>");
                });
            }
        });
     }
});

Then just add a closing div tag via the append attribute