【2022年最新】Advanced Editor Tools（TinyMCE）の使い方3ステップ【使える機能を解説】

「TinyMCE Advancedを使いたい」
「Advanced Editor Toolsを入れると何ができるの？」
「具体的な設定方法が知りたい」

このように考えている人がいるのではないでしょうか。無料のプラグインでWordPressの記事を見やすくできるのであれば、試してみたいですよね。

Advanced Editor Toolsを導入すれば、記事の編集時にさまざまな機能を使えるようになり、記事の見栄えを良くできます。ただし、プラグインを使うことに慣れていないと、使い始めるまでに手間取ってしまうかもしれません。

そこで本記事では、Advanced Editor Toolsについて以下の内容を解説します。

• Advanced Editor Toolsの概要
• 使い方3ステップ
• 使えるボタン一覧

Advanced Editor Toolsの使い方を理解して、記事作成に役立てられる内容になっているので、ぜひ最後までお読みください！

Advanced Editor Tools（TinyMCE）とは？概要をサクッと解説

まずはAdvanced Editor Toolsの概要を理解しておきましょう。

1. 概要
2. 導入するメリット

それぞれについて、順番に詳しく解説します。

1. 概要

Advanced Editor Toolsは、WordPressの記事編集画面のツールバーをカスタマイズして、使いやすくするためのプラグインです。

クラシックエディター（旧エディター）とブロックエディターの両方に対応しており、無料で利用できます。

以前は「TinyMCE Advanced」という名称でしたが、改名してAdvanced Editor Toolsとなりました。

導入するだけで、WordPressでさまざまな編集を簡単に行えるようになります。例えば以下のような機能が利用可能です。

• 下線を付ける
• 背景色を付ける
• フォントを選択する
• 上付き文字を挿入する

WordPressサイトを立ち上げたら、まずAdvanced Editor Toolsを導入しておくとよいでしょう。

Advanced Editor Toolsを導入すれば、最初に投稿する記事から思い通りの編集ができるようになります。

2. 導入するメリット

Advanced Editor Toolsを導入するメリットは、ツールバーのボタンを押すだけで、便利な編集機能が使えることです。

実際にはAdvanced Editor Toolsを使わなくても、ソースコードを打ち込めば、WordPressの編集機能自体は使えます。しかし、WordPress初心者にとってソースコードを扱うのは難しいうえに、手間もかかってしまいます。

そこでAdvanced Editor Toolsを利用すれば、格段に編集作業がしやすくなります。

Advanced Editor Toolsで追加できるツールバーに表示されるボタンは、以下のようにカスタマイズが可能です。

• 並び替え
• 複数段を使って配置
• 必要なボタンを追加
• 不要なボタンを削除

こうしたカスタマイズを、ドラッグ＆ドロップの簡単な操作で実現できます。自分にとって使いやすい編集画面を作ることで、記事作成の効率を高められるでしょう。

Advanced Editor Tools（TinyMCE）の使い方3ステップ

Advanced Editor Toolsの使い方を、3ステップで具体的に解説します。

1. プラグインをインストールする
2. ツールバーを設定する
3. 記事作成時にボタンを活用する

それぞれについて、順番に詳しく見ていきましょう。

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

まずは、WordPressの管理画面からプラグインをインストールします。

「プラグイン」から「新規追加」を選択して、キーワードで「Advanced Editor Tools」と入力して検索しましょう。

インストール後には、プラグインの「有効化」を忘れずに行う必要があります。

2. ツールバーを設定する

WordPress管理画面の左側メニューの「設定」から「Advanced Editor Tools（TinyMCE Advanced）」を選択しましょう。

設定画面は「旧エディター（TinyMCE）」と「ブロックエディター（TinyMCE）」の2つのタブに分かれています。使用するエディターのツールバーしか表示されないので、どちらか一方のみ設定すれば問題ありません。

それぞれのエディターについて、設定方法を解説します。

旧エディター

ツールバーで利用できるボタンが、下図のように一覧で表示されています。

「クラシックエディター用ツールバー」と「使用しないボタン」にあるボタンをドラッグ＆ドロップして編集しましょう。最大で4段にわたってツールバーを表示させ、ボタンの追加・削除・並び替えができます。

画面下部に設定項目がありますが、デフォルト状態のままで問題ありません。ツールバーの編集を終えたら、画面右上の「変更を保存」をクリックしましょう。

ブロックエディター

ブロックエディターでは、ツールバーを編集できる場所が3箇所あります。

まず、下図の「メインツールバー」と「代替サイドツールバー」です。

「代替サイドツールバー」で設定したボタンは、ブロックエディターで編集する際に、サイドバー内に表示されます。

さらに「クラシックブロック」を使用した際に表示されるボタンも、下図の「クラシック版の段落とクラシックブロックのツールバー」で設定可能です。

ボタンをドラッグ＆ドロップすることで、ボタンの追加・削除・並び替えができます。画面下部の設定項目は、デフォルト状態のままで問題ありません。

編集を終えたら、画面右上の「変更を保存」をクリックしましょう。

3. 記事作成時にボタンを活用する

ツールバーの設定後に記事編集画面を開くと、設定したツールバーが表示されます。記事の編集時にツールバー上のボタンを押せば、様々な機能が使えます。

ツールバーは何度でも設定し直せるので、さらに使いやすくなるように、ボタンの数や配置を調整していくとよいでしょう。

Advanced Editor Tools（TinyMCE）で使えるボタン一覧

Advanced Editor Toolsで使えるボタンを一覧で紹介します。

気になるボタンがあれば、ご自身のWordPressサイトの記事編集時に使ってみてください。

【4月30日まで】WordPress移行応援キャンペーン！
「BOX1 : 40％OFF」「BOX2〜BOX8 : 50％OFF」&ドメイン永年無料

【最短5分】WordPressブログの始め方を小学生でもわかるように解説