TinyMCE Advanced 使い方

TinyMCE Advanced は WordPressのエディターを

使いやすくするためのプラグイン。

 

自分好みのボタン配置に設定できますし、記事作成の効率化に役立てましょう。

この記事では、TinyMCE Advancedの使い方について解説します。

 

また、僕が採用しているオススメの設定方法も紹介。

TinyMCE Advancedとは??

TinyMCE Advanced 使い方

まず、TinyMCE Advancedは、↑のようにエディターのボタンをカスタマイズするプラグインです。

 

このTinyMCE Advancedによって、

 


【TinyMCE Advancedの便利さ】

・文字の色付け

・背景色

・フォントサイズ

・見出しの設定

・太字

・下線

・箇条書き


 

などといった文字の装飾をスピーディーにできます。

TinyMCE Advancedのインストール

さっそく、TinyMCE Advancedのインストール方法について説明します。

 

いつもの様にワードプレスの管理画面から、


【1. プラグインの新規追加】 

  ↓

【2. TinyMCE Advancedで検索】 

(※注意) “Tiny MCE Advanced” ではなくて、“TinyMCE Advanced” でお願いします。”Tiny MCE Advanced(TinyとMCEの間にスペースがある)” では検索に出てこず、見つからない可能性があります。

  ↓

【3. 今すぐインストール】


の順でインストールをしてしまいましょう。

TinyMCE Advanced 使い方

(※注意) “Tiny MCE Advanced” ではなくて、“TinyMCE Advanced” でお願いします。”Tiny MCE Advanced(TinyとMCEの間にスペースがある)” では検索に出てこず、見つからない可能性があります。

 

インストール後は、すぐに【4. 有効化】を押してOKです。

TinyMCE Advanced 使い方

TinyMCE Advancedの設定画面の使い方

続いて、TinyMCE Advancedの設定についてですが、

ワードプレスの管理画面にて、

【設定】 ⇒ 【TinyMCE Advanced】とクリックすると操作画面に入ります。

TinyMCE Advanced 使い方

 

すると、ちょうど以下のような画面に入るので、

移動させたいボタンをドラッグ&ドロップしましょう。

 

ここの例では、【フォントサイズのボタンを移動】させています。

TinyMCE Advanced 使い方

 

マウスで『フォントサイズのボタン』をドラッグして移動させて・・・

TinyMCE Advanced 使い方

 

『段落ボタン』の右隣りで『フォントサイズのボタン』を放して移動させました。

TinyMCE Advanced 使い方

 

TinyMCE Advancedの設定画面では、下にもたくさんのボタンがありますよね。

このように、色々とボタンが用意されているワケですが、

好みのボタンを選んで、あなたが好きな順番で並び替えてあげると良いでしょう。

 

同様に説明しておきますと、

『下線(アンダーライン)ボタン』をマウスで掴んで移動させ、

TinyMCE Advanced 使い方

 

使いやすい好みの場所に設置してカスタマイズ。

TinyMCE Advanced 使い方

特に、TinyMCE Advancedの設定には決まりは無いので、使いながらカスタマイズしてけばOKです。

 

ちなみに、僕のTinyMCE Advancedの愛用設定は以下のような感じ。

TinyMCE Advanced 使い方

左から順番に、


【1. 段落】【2. フォントサイズ】【3. 文字色】【4. 背景色】

【5. 下線(アンダーライン)】【6. イタリック】【7. 太字(strong)】

【8. 引用】【9. 番号なしリスト】【10. 番号付きリスト】

【11. 左寄せ】【12. 中央揃い】【13. 右寄せ】

【14. リンクの挿入/編集】【15. リンクの削除】


 

設定が終わったら、右上の【変更を保存】のボタンを押して完了です。

TinyMCE Advancedの設定をしくじったら・・・

ここまで、TinyMCE Advancedの設定画面の使い方について書いてきました。

エディターのボタンを移動させていると、初期設定に戻したくなることが多々あります。

 

もしもTinyMCE Advancedの設定をデフォルトに戻したい場合は、

TinyMCE Advanced 使い方

↑のように最下部の【1. デフォルトの設定を復元】を押して、【2. 変更を保存】すればOKです。

 

以上のようにTinyMCE Advancedの設定はサクッとデフォルトにできますので、

自分にピッタリの設定へとドンドン改良していきましょう。