New webLog$$

首都圏で奮闘するWebディレクター$$のブログ。

2016/2/3

リッチなエディタを使い記事の投稿ができるWordPressプラグイン

WordPressプラグイン:TinyMCE Advancedについて

WordPressの投稿画面には、ビジュアルエディタとテキストエディタの二つがあります。

ビジュアルエディタ

標準のビジュアルエディタを使った投稿は「太字」「イタリック」「取り消し線」「番号無リスト」「番号付きリスト」「引用」「横ライン」「左寄せ」「中央揃え」「右寄せ」「リンク挿入」「リンク削除」があります。

また、ツールバーの切り替えを行う事で「段落」「下線」「両端揃え」「テキスト色」「インデント」などの効果を与える事もできます。

文字を選択し、ボタンをクリックするだけなので、wordで文章を作成する感じでブログに反映する事が可能です。

テキストエディタ

HTMLベースで入力が出来る場合は、テキストエディタモードがお勧め。

ビジュアルエディタと同様に、文字を選択し、ボタンをクリックするだけでHTMLが出来あがります。

標準のボタンに物足りなくなったら

標準のビジュアルエディタでも無料ブログと同じように、日記感覚で記事を書くことが出来ますが、記事の装飾が物足りなくなったらTinyMCE Advancedをインストールしてみるのはいかがでしょうか。投稿画面が下記のように変わります。

標準のビジュアルエディタの投稿画面
標準のビジュアルエディタの投稿画面

TinyMCE Advancedの投稿画面
TinyMCE Advancedの投稿画面

インストールと設定と使い方

インストール

ダッシュボードのメニューからプラグインの新規追加
メニュー→プラグイン→新規追加

 

プラグインを追加
「TinyMCE Advanced」を検索

 

TinyMCE-Advanced
「今すぐインストール」をクリックすればインストールが完了します。

設定と使い方

ダッシュボードのメニューからTinyMCE Advancedの設定画面へ
メニュー→設定→TinyMCE Advanced

TinyMCE Advanced ‹ dev.webLog$$ — WordPress
Unused Buttonエリアに追加可能なボタンが並んでいるので、新しいボタンをマウスでドラッグし灰色のスペースへとドロップさせると新たなボタンの追加が可能です。
既に追加されているボタンの中に不要なものがあれば、Unused Buttonエリアに戻すもできます。

「Enable the editor menu」にチェックを入れるとエディタの上部に TinyMCE Advanced で使用できる全ての機能が前部入りのメニューバーが表示されます。
投稿画面の高さを少なくしたい場合は、あまりボタンを入れずにメニューバーで操作するなども可能ですね。

最後に画面右下の「Save Changes」ボタンのクリックで設定完了!忘れずにクリックしてください。
オプション設定も可能

ここは、デフォルトのままでいいと思います。テーマファイルを独自で作っていたりCSSのカスタマイズをしている場合には、不要タグの設定や、文字サイズをピクセル指定出来たりが出来るあ感じ。

プラグインの利用は自己責任でお願いします

万が一このWordPressプラグイン:TinyMCE Advancedを利用し損害やトラブルが発生したとしても、私は一切責任を負いかねます。
WordPressプラグイン:TinyMCE Advancedは自己責任においてご利用ください。

PR

この記事へのコメント

FBコメント

コメントはお気軽に

メールアドレスは公開されません。

内容に問題なければ、下記の「コメントを送信する」ボタンを押してください。

関連する記事