TinyMCE Advancedの使い方ーWordPressプラグイン【初心者向け】

WordPressのプラグインの使い方を初心者向けに紹介する記事です。

今回は、WordPressのビジュアルエディタを拡張できるプラグインの1つである、TinyMCE Advancedの使い方を紹介します。

 

なお本記事は、TechAcademyのWordPressオンラインブートキャンプの内容をもとに紹介しています。
 

 

TinyMCE Advancedとは

インストールするだけでビジュアルエディタを拡張できるプラグインです。エディタ拡張プラグインは他にもありますが、このプラグインは、特にカスタマイズ性に優れています。

いつも使うボタンだけを簡単に並べておけるので、作業効率が上がること間違いありません。

まずはデフォルトのエディタと比較してみましょう。

 

デフォルトのビジュアルエディタ

プラグインインストール前は、こんなシンプルなエディタ画面です。

 

TinyMCE Advanced導入後のビジュアルエディタ

ビジュアルエディタで利用できるボタンが増え、ブログサービスやMicrosoft Wordと使用感が近づきます。

では、設定方法を見ていきましょう。

 

 

プラグインをインストールする

このプラグインは、管理画面から「プラグインを検索」してインストールもできますし、プラグイン公式サイトからダウンロードすることも可能です。

インストールがわからない場合は、WordPressのプラグインをインストールする方法をご覧ください。

 

有効化すると、ダッシュボード＞設定の中に、プラグインの管理画面へのリンクボタンが表示されます。

 

 

[PR] WordPressで挫折しない学習方法を動画で公開中

プラグインをカスタマイズする

表示するボタンをカスタマイズしてみましょう。管理画面を開くと、たくさんのボタンアイコンが表示されています。

上部は、現在使用中のボタンの一覧です。実際に表示されている順番なので、ドラッグ&ドロップで並び替えることもできます。

 

また、削除したいものは、下の未使用ボタンエリアにドラッグ、追加したいものは使用中のボタン一覧にドラッグするだけです。

カスタマイズが完了したら、ページ下部の「Save Changes」をクリックするのを忘れないようにしましょう。

 

ちなみに、管理画面が英語なのでボタンの機能がわかるか不安と思った方がいらっしゃるかもしれませんが、エディタでボタンにマウスオーバーすると、そのボタンの機能が日本語で表示されますのでご安心ください。

 

また、複数行設定したにも関わらず、1行目のボタンしか表示されないという場合には、「ツールバーの切り替え」ボタンをクリックすれば2行目以降も表示されます。

今回の記事は以上です。

実際に導入してカスタマイズしてみてください。

他のビジュアルエディタを拡張できるプラグインを使ってみたい場合は、Ultimate TinyMCEの使い方も合わせてご覧ください。

 

 

[お知らせ]TechAcademyでは、WordPressを使ってカスタマイズしたオリジナルサイトを構築できるWordPressオンラインブートキャンプを開催しています。期間中の8週間は現役エンジニアのメンターが毎日学習をサポートするので、独学よりも効率的に学ぶことができます。