ワードプレス(WordPress)の投稿画面を簡単に使いやすくするプラグイン!「Advanced Editor Tools(旧TinyMCE Advanced)」のインストールと使い方

ワードプレス構築入門

Advanced Editor Tools(旧TinyMCE Advanced)とは?

Advanced Editor Tools(旧TinyMCE Advanced)はクラシックエディター (TinyMCE) を拡張、強化してくれるプラグインです。

僕自身もブログを書くのに使用していますが、他のブログと差別化できて大変役に立ちます。

デフォルトのビジュアルエディターをカスタムする

「Advanced Editor Tools」プラグインインストール前の投稿画面は下のようなシンプルなエディタです。

 

「Advanced Editor Tools」インストール後はエディタ画面がこんなに変わります。

 

しかしここで注意しておきたい違いがあります。
インストール後「スタイル」のドロップダウンメニュー「ツールバー」から消えてしまいます。
スタイル」のツールはとてもよく使用しますので後でメニューバーに戻す設定を解説しておきます。

Advanced Editor Tools(旧TinyMCE Advanced)プラグインをインストールする

全てのプラグインは、ダッシュボード➡️「プラグイン」➡️「プラグインを検索」してインストールします
ワードプレスを始めたら導入しておくと良いおすすめのプラグインとインストール方法をこちらでご紹介していますので読んでインストールしておいてくだい。⬇️
ワードプレス初心者の僕にも出来た!導入すべきプラグインとインストール方法をお教えします。
導入しておくと良いおすすめのプラグインの紹介そのインストール方法ご紹介。プラグインはワードプレスを安全・便利に使うために入れます。 不具合に繋がる恐れもあるのでプラグインは入れすぎてもいけません。次の12個の必要なプラグインだけを入れておきましょう

ビジュアルエディターに「スタイル」のドロップダウンメニューを表示させる方法

Advanced Editor Tools(旧TinyMCE Advanced)をインストールした後「スタイル」のドロップダウンメニューを表示させるには、ダッシュボード「設定」➡️「Advanced Editor Tools(TinyMCE Advanced)」を選択

 

「ブロックエディター(TinyMCE)」のコマンドが選択されていまが、特に設定することはないので「旧エディター(TinyMCE)」を選択して下さい。

「スタイル」ボタンをツールバーに移動させる

「旧エディター (TinyMCE)」の画面で「段落」のドロップダウンメニューの右横に「スタイル」のボタンをカーソルでドラッグして移動します。

 

「スタイル」ボタンを配置したら「変更を保存」をクリックして終了です。

 

「設定を保存しました。」と表示されたらOK

Advanced Editor Toolsのタイトル下に表示される「Please note: This plugin was renamed from “TinyMCE Advanced” to “Advanced Editor Tools”. The plugin functionality remains the same.」は、「このプラグインは”TinyMCEAdvanced”から”AdvancedEditorTools”に名前が変更されました。機能は変わりません」と言う注意書きですので気にしないでOKです。

もし、Advanced Editor Tools(旧TinyMCE Advanced)プラグインを利用していて、「スタイル」のドロップダウンメニューが表示されていない場合は、この設定を試してみてください。

投稿記事を目立たせるのによく使う機能(ツール)

僕が記事を執筆している時によく使っているツールの使い方を少し紹介します。

文字の背景に色のついたマーカーを引く方法

文中の文字の背景に色のついたマーカーを引くにはスタイルから「マーカー」➡️「○○色マーカーもしくは○○色アンダーラインマーカー」を選択します。

背景にマーカーを引きたい場所の文字を選択してマーカーを選択すると下のような感じになります。
色分けすることによって読者さんにわかりやすく訴えかけることができます。
(例)赤色マーカーを使っています。黄色マーカーを使っています。青色アンダーマーカーを使っています。

記事中に補足情報やメモをボックスで囲む方法

「ここに補足を入れたい、注意を促したい」などの文章を記事の内容に応じて記事中に入れてやると読者にもわかりやすく、楽しいブログになります。
それも「スタイル」のメニューから「ボックス」を選んで簡単に挿入することができます。
ここでは例としてボックス(アイコン)の使い方です。
文章を選択して「スタイル」から「ボックス(アイコン)」➡️「注意喚起」(!)を選択
使うボックスの種類やメニューによって様々な表現ができますので是非これは使ってみて下さい。
注意喚起 注意喚起 注意喚起 注意喚起 注意喚起 注意喚起
注意喚起 注意喚起 注意喚起 注意喚起 注意喚起 注意喚起
コメント コメント コメント コメント コメント
コメント コメント コメント コメント コメント
プロフィール プロフィール プロフィール プロフィール
プロフィール プロフィール プロフィール プロフィール

Cocoonの吹き出し機能の使い方(吹き出しデザインのカスタム)

ワードプレスのテーマをCocoonにしたらやはり使いたいのがこの「吹き出し」の機能です。
サンプルが用意されていますし、画像を自分が使いたい人物の画像にカスタムすることもできます
吹き出しの中の言葉も入力するだけで簡単に面白い記事にすることができます。
「吹き出し」のメニューの中から人物を左に置きたい場合は「人物(左)」を選択、右に置きたい場合は「人物(右)」を選択します。
吹き出しの中の「内容を入力して下さい」に会話調の言葉を入れれば出来上がりです。
(例)

投稿記事に吹き出しを入れるにはどうすれば良いですか?

ワードプレスのテーマをCocoonにしてAdvanced Editor Toolsのプラグインを導入するといいよね。

 

 

タイトルとURLをコピーしました