CODEWITHSUNDEEP
javascriptjqueryhtmlcsstinymce
krmax44
krmax44

Reputation: 334

TinyMCE - wrap multiple elements in one div

I want to use style_formats in TinyMCE 4. One style_format should wrap content into a well like this:

Before:

<p>Hello!</p>
<p>More stuff...</p>

After:

<div class="well">
  <p>Hello!</p>
  <p>More stuff...</p>
</div>

...but what I get is:

<div class="well">
  <p>Hello</p>
</div>
<div class="well">
  <p>More stuff...</p>
</div>

My style_format looks like this:

style_formats: [{
  title: 'Box',
  block: 'div',
  classes: "well"
}]

What am I doing wrong? Thanks in advance!

Upvotes: 1

Views: 1569

Answers (1)

krmax44
krmax44

Reputation: 334

I found a way:

setup: function(ed) {
    ed.addButton('well', {
        title: 'Make Well',
        icon: false,
        onclick: function() {
            var text = ed.selection.getContent({
                'format': 'html'
            });
            if (text && text.length > 0) {
                ed.execCommand('mceInsertContent', false,
                    '<div class="well">' + text + '</div>');
            }
        }
    });
},
toolbar: "well"

...just in case anybody needs it.

Upvotes: 2

Related Questions