TinyMCEの中で非編集可能な要素に基本的なスタイルを適用します

Question

コンテキスト：

TinyMCEの要素を非編集可能にすることを可能にするnoneditableプラグインを持っています。要素にmceNonEditableクラスがある場合、TinyMceはその要素を編集不可能にします。

問題：

私は基本的なスタイリングのタグと、この非編集可能な要素をラップすることができるようにしたいです。例えば

私が持っている場合：

Hello <span class="mceNonEditable">user_name</span> how are you today ? 

私は編集不可スパンを選択し、TinyMCEのBLODボタンをクリックしuser_name上でクリックした場合。

私は結果がなりたい：

Hello <b><span class="mceNonEditable">user_name</span></b> how are you today ? 

しかし、これに代えて、何も起こりません。 TinyMce Blodボタンをクリックすると、コードは変更されません。

私はこれを証明するために、小さなjsFiddleを作成：https://jsfiddle.net/timotheejeannin/2hhpenm5/

私が試したもの：

• 設定違っ編集不能プラグイン（https://www.tinymce.com/docs/plugins/noneditable/）
• 編集不可を上書きするdata-mce-contenteditable属性を使用しますボタンがクリックされたときの動作（See usage in TinyMce source code in DOMUtils.js line 1739）
• コンテンツの編集可能な検出を囲みます。 （See in TinyMce source code in Formatter.js line 609）
• （それはプラグインの問題を解決することはできませんように見える）私自身のプラグインをビルドし

私は本当にあなたが役立つことを願って！

Answer 1

私はあなたのTinyMCE設定に追加できる簡単なカスタムツールバーボタンでこれを行うことができると信じています。

編集不可能な要素をクリックすると、編集不可能な要素全体であるDOMノードが効果的に取得されます。その場合、DOM操作を使用して、その要素にスタイルを追加したり、別のタグに要素をラップしたりできます。あなたが編集不可能な要素をクリックすると、あなたは全体の編集不可能な要素がテキストを太字新しいインラインスタイルを取得することに注意しますAdd Style to Nodeボタンをクリックすると

http://fiddle.tinymce.com/sDfaab

：たとえば、このTinyMCEのフィドルを参照してください。