Make non editable bold

by Timothée Jeannin

HTML

<script src="//cdn.tinymce.com/4/tinymce.min.js"></script>
<textarea id="mytextarea">
  <p>
    I am editable.
  </p>
  <p>
    <span class="mceNonEditable">
      I am not editable, but I want to be wrapped by a 
      bold tag when the bold button is clicked. 
    </span>
  </p>
</textarea>

<br/>
<br/> When I click on the <b>B</b> button while the non editable span is selected in the editor, I would like the non editable span to be wrapped by a <b>b</b> tag.

JavaScript

tinymce.init({
  selector: '#mytextarea',
  plugins: ['noneditable'],
  content_style: ".mceNonEditable {	background: #68f7ff; }",
  toolbar: 'bold',
  menubar: false,
  statusbar: false
});