ヘッダーを追加するためのカスタム tinymce プラグインを作成しました。
- (このプラグインは、読み取り専用テキストをエディターに追加するために使用されます)
- これらのヘッダーは、属性 contenteditable="false" を持つ div に挿入されます
- Like
<div class="headerDiv" contenteditable="false">Marks</div>(headerDiv は、div をインラインとして設定するために使用されます)
私は tinymce noneditable プラグイン regex を使用していません。私にとっては、リストボックスからの挿入に取り組んでいません。（画像をご確認ください）
選択したコンテンツを編集不可能なヘッダーに揃えようとすると、問題が発生します。ヘッダーは次の行に表示されます。（画像をご確認ください）
私は tinymce_src.js をチェックしました。それから、配置がどのように機能するかを理解し、エディターからコンテンツを取得し、その周りに div をラップし、text-align プロパティを使用してその div を配置します。ラッピング セクションでは、選択したコンテンツに html タグがあることを確認し、タグが見つかった場合はコンテンツを 3 つに分割します。
タグの前のコンテンツ
html タグを含むコンテンツ
タグの後の内容
この3つの部分をdivでラップします
tinymce で選択したコンテンツの例: 生の tepmlate マーク
- パート1 ：
<div style="text-align:center">raw tepmlate</div> パート2 ：
<div style="text-align:center"><div class="headerDiv" contenteditable="false">Marks</div></div>パート 3 :
<div style="text-align:center"> </div>
ガイダンスとヘルプをいただければ幸いです..!