prevent child element to be editable in mediumEditor.js

Question

How to prevent editing child element by medium-editor whereas parent element is editable. Example:

<div class="editable">
 This text should be editable<span class="no-editable"> This text should not be editable.</span>
</div>

<script>
  var editor = new MediumEditor('.editable');
</script>

Answer 1

You just need to wrap it around a non-contenteditable attribute.

<script src="https://yabwe.github.io/medium-editor/bower_components/medium-editor/dist/js/medium-editor.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet"/>
<link href="https://yabwe.github.io/medium-editor/bower_components/medium-editor/dist/css/medium-editor.min.css" rel="stylesheet"/>
<link href="https://yabwe.github.io/medium-editor/bower_components/medium-editor/dist/css/themes/tim.min.css" rel="stylesheet"/>

<div class="editable">
  <p>
    This text should be editable
  </p>
  <p contenteditable="false">
    This text should not be editable.
  </p>
</div>

<script>
  var editor = new MediumEditor('.editable');
</script>