TinyMCE Advanced は、記事を書くためのビジュアルエディターをより使いやすくカスタマイズができるプラグイン。
使用頻度の高いタグを追加して好みの配置に並べ替えることができる。初期のままだとビジュアルエディターよりもテキストエディターがメインだったのが一変します。
作業効率化を図るための必須プラグイン TinyMCE Advanced の導入手順とその機能の解説したいと思います。
インストール済みプラグインの確認
プラグインがすでにインストール済みで有効化がされているかを確認します。プラグインがなければプラグイン ＜ 新規追加よりプラグインのインストール及び有効化をします。
確認が取れたら簡単設定の手順に進みます。プラグインのインストール方法を確認したい場合は、下記の関連記事のプラグインインストール方法を確認ください。
プラグイン簡単設定の手順 ③
① サイドバー設定 TinyMCE Advanced
② この部分は使用しないボタンから
好みのボタンを上の白枠へ
不要なボタンは使用しないボタンへ
③ 段落タグの保持 変更を保存
設定は完了です✨
ボタンを追加や削除、配置替えは、とりあえず変更なしでOK。エディターを使っていく過程で随時カスタマイズしていけば良いです。
テキストエディターでは、表示が省略される段落タグ<p>や改行タグ<br />を高度オプションの段落タグの保持で表示させることができます。
ここでは、あえて表示するように変更していますが、人それぞれ好みがあると思うのでスッキリとコードを見やすくしたいと思うなら、ここのチェックは外しても構いません。
初期のままだとうまく改行ができないことがあったので表示することを優先しました。なお改行タグの扱いは注意が必要です。
もしエディターに不具合がある場合は、必要に応じてデフォルトの設定を使い復元して下さい。
追加機能の一覧
ビジュアルエディターに追加できる機能一覧。記事作成に欠かせない基本的な機能が一通りあるので、テキストエディターのタグ打ち作業の手間がほとんど解消されるかと思います。
追加できる機能よりもテキストエディターで編集する方が早い場合やキーボードのショートカットが使えるものまで含まれているので必要に応じて使えるものだけを抜粋します。
オススメする機能
記事を作成する上で、とても使用頻度の高いものを抜粋してみましたので参考まで。
- フォントファミリー
いくつかの書体の中で変更ができる - フォントサイズ
文字サイズ変更 8pt〜36pt 拡張で 8pt〜60pt - フォントカラー
カラーピッカーから視覚的に選べる - テキストとしてペースト
データのコピペには必ず必要となる機能 - テーブル
簡単に作表、挿入、削除、色の追加など - 取り消し
謝って消してしまったときに戻せる - 両揃え
段落の先頭の文字と後ろの文字を揃える
テーブルに関しては、ビジュアルエディターを使うと無駄にスタイルタグが入るので、一時的なタグの挿入や削除などに使用。それ以外はテキストエディターで編集することが多いです。
あくまで補助機能の一つなので、無理して使ったことで返って作業の妨げにならないように使い分けは必要かと思います。
クリックだよ✨