こちらの記事では、TinyMCE Advancedというプラグインの設定と使い方を紹介します。

 

TinyMCE Advancedとは、WordPressで記事を作成する時にフォントの色やサイズを変えるといった文章の見た目の設定がとても簡単になるプラグインです。

 

かつては『HTMLの知識がないと使いこなすのが難しい』とさえ言われていたWordPressブログですが、TinyMCE Advancedを使うことで簡単な操作で記事を投稿することができるようになります。

 

作業効率が格段にアップするプラグインですので、ぜひ導入しておきましょう。

 

TinyMCE Advancedの設定方法を動画で解説!

TinyMCE Advancedの設定方法を画像で解説!

WordPressのダッシュボードからTinyMCE Advancedプラグインをインストールして有効化。

有効化までを画像で解説したページはこちら→WordPressにプラグインをインストールし有効化する方法

 

「設定」→「TinyMCE Advanced」を順にクリック。

 

よく使うであろう機能のボタンを、下から上へドラッグ&ドロップします。

フォトサ」や「」はデフォルトで上に入っていますが、「背景色」も必ず必要になってくると思います。

 

下の方へスクロールして、高度なオプションの

「段落タグの保持」にチェック。

こちらにチェックを入れることで、ビジュアルモードとテキストモードの切り替えを行った際でも、勝手に改行されたり空白が入ることを防止できます。

 変更を保存  をクリック。

 

これでTinyMCE Advancedの設定は終了です。

お疲れ様でした!

TinyMCE Advancedの使い方を解説

続いては、TinyMCE Advancedの使い方を解説します。

装飾を加えたいテキストをドラッグして選択しておいた状態で、ボタンをクリックすればテキストに装飾ができます。

テキストの色を変えたい場合など

変えたい部分をドラッグして選択。

 のボタンがを変更するボタンです。

もしどのボタンが何の機能か知りたい場合はボタンの上にマウスを持って行く(マウスオーバーする)と、上図のように吹き出しが出てボタンの機能を知ることができます。

 のボタンの 右のをクリックすると色パレットが出てくるので、好きな色を選択。

 

これでフォントの色を変えることができました。

 

他の機能についても同じ要領で、

装飾したい部分をドラッグして選択

ボタンをクリック

すればテキストに装飾を加えることができます。

表(テーブル)を挿入したい場合

「テーブル」ボタンのをクリック

「テーブル」をポイント

作りたい表に応じてマス目をドラッグ

 

上図の状態だと4列×3行のテーブルが出来上がります!

 

【テーブルを応用してテキストボックスを作成する方法】

Tiny MCE Advancedで簡単にテキストボックスを挿入する方法

ドラッグするマス目を1つだけにすることで…

 

こんな感じ↓で簡単にテキストボックスを挿入することができます。

あいうえお

かきくけこ

使っているテンプレートによっては、正規のテキストボックスを挿入するよりもこちらの方が早くできることがあります。

私は賢威ユーザーなのですが、テキストボックスを使うのが面倒なのでこの方法にしています。

表(テーブル)を削除したい場合

テーブルのどこかをクリックした状態で「表の削除」をクリック

 

これで、表を削除することができます。

 

スマホで見た時に表が画面からはみ出る問題を解消する方法はこちらにまとめました!
WordPressで表(テーブル)の幅をレスポンシブ(スマホにも合うよう)にする方法!

リンクを挿入したい場合

リンクを挿入したい文字列をドラッグして選択
または
リンクを挿入したい画像をクリック

WordPressプラグインTiny MCE Advancedでリンク挿入する方法

クリップのマークのボタンをクリック

 

外部リンクを貼る場合

WordPressプラグインTiny MCE Advancedでリンク挿入する方法

リンク挿入BOX内にURLを入力 → エンター

 

内部リンク(同一ドメイン内へのリンク)を貼る場合

WordPressプラグインTiny MCE Advancedでリンク挿入する方法

ドメインより後の部分(/以降の部分)を入力 → エンター

内部リンクの場合に全URLを入力すると、時々なぜか上手くいかない場合があるので/以降だけ入力してます。

/以降だけ入力すれば今のところ大丈夫なようです。

リンクを貼る際の時短ワザ

リンクを貼りたい箇所をドラッグして選択してから

Windows Ctrl + K
Mac command + K

を押下するとリンク挿入BOXが出現しますので、後は適宜入力しエンターしてください。

リンクを削除する方法

リンクが挿入されている文字列のどこか(どこでもOKです)をクリック

WordPressプラグインTiny MCE Advancedでリンク挿入する方法クリップマークのボタンをクリック

 

これでリンクを削除できます。

さいごに

TinyMCE Advancedは、HTMLの知識がなくても体裁の整った記事を書くことができるのでとてもオススメなプラグインです。

 

この便利なプラグインをどんどん活用して、読みやすい記事を書いていきましょう。