ワードプレス開設&設定

TinyMCEAdvancedの設定手順!私が実際に使ってる34の編集ボタンリスト

TinyMCEAdvancedの設定

ワードプレスは、デフォルトでは「表の挿入や編集」「YouTubeの動画コードの挿入」などがすぐにできない状態です。

これらの機能は、記事を書く上で必要になってくる機能です!

それを可能にするプラグインが「TinyMCE Advanced」というプラグイン。

「TinyMCE Advanced」を入れていないと、HTMLで自分自身でタグやコードを打たなければならないことに・・

それはPC操作も慣れていない超初心者には至難の業ですよね・・( ;∀;)

それが、無料のプラグインを入れればクリック一つで「表の挿入や編集」「YouTubeの動画コードの挿入」などができるようになります!

ブログを書き始める前に「TinyMCE Advanced」を入れるのがおススメです

ノコ
こちらの記事では、「TinyMCE Advanced」の設定方法をお伝えしていくよ。

 

TinyMCE Advancedの設定の流れ

TinyMCEAdvanced 設定の流れ

ワードプレスにプラグインのTinyMCE Advancedを入れると、ビジュアルエディタの機能を拡張することができます。

つまり、このような投稿画面の編集ボタンを充実させることができるということ!

エディタ投稿画面の編集ボタン

編集ボタンを充実させると、いろいろな機能がボタン一つで記事作成時に使えるようになるんです。

記事の装飾がすっきり読みやすくできるかが、ユーザーが記事を最後まで読んでくれるようにできるか?!の大事なポイントの一つ。

ノコ
ブログ超初心者の私でも、この機能があったからこそ、時間をかけずに記事の装飾をすることができたよ。

この編集ボタンを充実させるためにも、TinyMCE Advancedを有効化したら、ブログ記事の投稿の前にきちんと設定を済ませましょう。

TinyMCE Advancedの設定画面の開き方

TinyMCE Advancedをインストールして有効化すると、ワードプレスの管理画面の左側「設定」の中に「TinyMCE Advanced」という項目が現れます。

TinyMCEAdvanced設定選択画面

このTinyMCE Advancedをクリック。

そうすると、TinyMCE Advancedの設定画面を開くことができます。

ノコ
一緒に流れに沿って設定していきましょう!

TinyMCE Advancedの設定の手順

TinyMCE Advancedで、設定していくのは、投稿エディタに編集ボタンを追加していくという作業。

※こちらでは、エディタにはクラシックエディタを使っていること前提で説明していきます。

2種類のエディタ画面についてはこちらで説明しています。

>>> 【画像付き】ワードプレス初心者でも5分でわかる!ブログ記事の投稿の手順5ステップ

さきほど開いたTinyMCE Advancedの管理画面で設定していきます。

エディター設定画面の「旧エディター(TinyMCE)」タグをクリック。

すると、「クラシックエディター用ツールバー」という画面になります。

この画面の下の方に「使用しないボタン」というたくさんのボタンが並んでいるエリアがありますよね。

TinyMCEAdvanced設定ボタンの移動

TinyMCEAdvanced設定画面

その中から、使いたいボタンを選んでクリック&ドラッグして、上の2段目のバーに追加していきます。

ノコ
最初は戸惑うかもしれないけど、慣れればとっても簡単です。

実際に私が使っている編集ボタンリスト

編集ボタンリスト

設定をする時、いったいどのボタンが必要なボタンなのか?

初心者だと見当がつきませんよね・・。

そこで、実際に私が使っている編集ボタンリストを紹介しますね!

ノコ
追加するときの参考にしてみてね。

※私は、ワードプレスのテーマに、アフィンガー5を使用しているので、アフィンガー5独自の編集ボタンも含まれます。

段落画像 段落
太字画像 太字
イタリック イタリック
引用画像 引用
番号なしリスト画像 番号なしリスト
番号付きリスト画像 番号付きリスト
右寄せ左寄せ中央揃え両揃え画像 左寄せ・中央揃え・右寄せ・両端揃え
リンクの挿入・削除 リンクの挿入・削除
メディアの挿入編集画像 メディアの挿入・編集
画像の挿入編集画像 画像の挿入・編集
ツールバー切り替え画像 ツールバーの切り替え
フォントファミリー画像 フォントファミリー
フォントサイズ画像 フォントサイズ
スタイル画像 スタイル
インシデントの増減画像 インシデントを減らす・増やす
テキスト貼り付け画像 テキストとしてペースト
設定の取り消し 書式設定をクリア
特殊文字画像 特殊文字
続きを読むタグ画像 「続きを読む」タグを挿入
テキスト色画像 テキスト色
背景色画像 背景色
マーク画像 Mark
表挿入画像 テーブル
タグ画像 タグ
太字 太字
太赤画像 太赤
太字マーク画像 太字
細マ画像 細マ
ルビ画像 ルビ
カウント画像 カウント
写真枠画像 写真枠
マイボックス画像 マイボックス
ボタン画像 ボタン
カード カード

こちらを追加しておけば、

トレンドブログの記事作成で困ることはないと思います。

私自身あまり使わないボタンもあるので、記事を書きながら、自分のスタイルが決まってきたら、使わないものは下に移動するなど、整理していくとよいかと思います。

ここに注意

「ツールバー切り替え」ボタンだけは、1段目の一番右に配置しないと、うまく機能しないので気を付けてね。

ノコ
最後に「変更を保存」ボタンをクリックするのを忘れずに!

TinyMCE Advancedで追加した主な編集ボタンの使い方

編集ボタンの使い方

さきほど設定して追加した主な編集ボタンの使い方はこちら!

<段落>

見出し2や見出し3にするために、H2やH3機能を使いたいときはこの段落という編集ボタンを使います。

段落

段落完了

<フォントサイズ>

フォントサイズを変えたい場合はこちらのボタンを使って文字の大きさを変えることができます。

フォントサイズ

フォントサイズ完了

<太字>

文字を太字にするにはこちらのボタン!

太字

<テキスト色>

文字の色を変えたい場合はこちら。

テキスト色

テキスト色完了

<テキスト背景色>

文字の背景の色を変えたいときはこちらのボタン。

背景色

背景色完了

<左寄せ・右寄せ>

左寄せや右寄せはこちらで編集できます。

右寄せは、引用元の表記を右に寄せる時には便利!

引用元右寄せ編集

引用元右寄せ

<ツールバー切り替え>

ツールバー切り替えボタンを押すと、2段目が隠れている場合に表示させたり、隠したりすることができます。

ツールバーの切り替え

ツールバーの切り替え完了

<続きを読むタグ挿入>

モアタグを入れたい場合はこちら。

続きを読む挿入

続きを読むタグ挿入完了

<番号なしリスト>

番号なしの箇条書きにしたい場合はこちら。

番号なしリスト

番号なしリスト完了

<番号付きリスト>

番号付きのリストにしたい場合はこちら。

番号付きリスト

番号付きリスト完了

<引用>

引用とわかりやすく表示したい場合はこちら。

引用編集

引用完了

<リンクの挿入>

リンクの挿入をしたいときはこちらのボタン。

リンクの挿入

リンクの挿入 URL入力

リンクの挿入終了

<テーブルの挿入・編集>

テーブルの挿入をしたいときはこちら。

テーブル挿入

<画像の挿入・編集>

画像の挿入や編集ができる編集ボタン。

画像を左や右に寄せる場合に、余白を入れることができます。

画像挿入高度な設定 余白

<動画の挿入・編集>

YouTubeの埋め込みコードはこちらで簡単に挿入できます。

メディアの挿入 埋め込みコード

これ以外にも便利な機能がいっぱいのTinyMCE Advancedの編集ボタン。

ノコ
最初からうまく使えないかもしれないけど、記事を書きながら、自分のスタイルを見つけて、使いこなしていけば大丈夫。

まとめ

TinyMCE Advancedの管理画面からエディター設定をしておけば、投稿画面の編集ボタンを自分の使いやすいように追加することができます。

何を追加すれば良いかわからない場合は、ひとまず、最低限の編集ボタンを追加しておけば大丈夫!

私が実際に使っているのは、34の編集ボタンです。

この34個があれば、記事作成で今まで困ったことはありませんでした。

記事を書いていく上で、編集に時間がかかってしまうのはもったいない!

プラグインのTinyMCE Advancedで、便利な編集ボタンを追加設定して、記事作成の時間を短縮できるようにしておきましょう。

ノコ
記事を書きながら、自分好みの投稿画面にしていってくださいね。わからないことがあれば、ご連絡くださいね。

 

 

  • この記事を書いた人

ノコ

3人の子育てをしながら、まったくの知識ゼロの状態からブログをスタートして、今ではブログの先生もしているノコと申します。 ブログを始めようと決めたきっかけは、子供の夢を応援するために引っ越しをしたこと。 引っ越し後に再就職を考えたとき、「これからは子供と一緒の時間を大切にしたい!それが実現できる仕事をしたい!」という思いから、その条件を満たす仕事としてネットで見つけたのがブログでした。 その後ブログ開始から5か月でブログ総収益100万円を達成。 そして、現在はブログの情報発信とともにブログの先生として日々サポートに全力投球しています。 メルマガでは、主なアクセスがたった3記事の月でも月収10万円という実績もレポートにて配信中。 アドセンスに楽天アマゾンなどの物販アフィリエイトを組み合わせて効率よくブログを収益化することが得意なので、その方法についてもメルマガで随時お伝えしています。 メルマガはこちらから https://happynoco.com/1up/oneup-mailform/

-ワードプレス開設&設定

© 2021 はっぴーノコブログ Powered by AFFINGER5