3.12 JavaScript editor.js のカスタマイズ

 ここまでのエディターのカスタマイズは、PHPでできる範囲なので、次のような不満な点があります。
   ・いったん保存しないと整形できない。
   ・ビジュアル・テキスト切り替えで文頭の字下げができない場合がある。
   ・ビジュアル→テキスト切り替えでHTMLに改行がない。
 ここまでのカスタマイズでも、HTML編集ができない一般ユーザは投稿を作成できます。しかし、使い勝手があまりよくありませんし、HTML編集を行いたい場合には不便です。
 これらを解決するには、次の JavaScript を改造する必要があります。
   wp-admin/js/editor.js
 JavaScript にはフックがないので、下記の手順で行います。
   (1) editor.js のファイルをコピーし別名で保存してから改造
   (2) editor.js の登録を削除
   (3) 改造したファイルを登録
 改造版の機能は次の通りです。
 1.ビジュアル→テキスト 切り替え
   ・先頭がタグでない場合pタグラップ
   ・shortcode のpタグラップ削除
   ・table 内 <p> 削除
   ・字下げ
   ・タグ前後に改行を挿入
 2.テキスト→ビジュアル 切り替え
   ・空の場合:<p>&nbsp;</p>
   ・先頭がタグでない場合pタグラップ
   ・shortcode のpタグラップ削除
   ・table 内 <p> 削除
   ・字下げ
   ・表の前後に<p>&nbsp;</p>を挿入
 3.ビジュアルモードでビジュアルがクリック
   “テキスト→ビジュアル 切り替え”と同じ

 なお、JavaScript に shortcode データを渡す処理も必要になります。

更新日:2015/11/21
掲載日:2015/11/21