QLOOKアクセス解析
Home » WordPress, WordPress プラグイン

ビジュアルエディタを高度にカスタマイズする、プラグイン「TinyMCE Advanced」

2011年3月22日 3,665 views 2 Comments

wordpress_tinymceadvanced02_3

記事投稿時に、htmlタグが分からなくても直感的にアレンジを可能にしてくれるTinyMCE(ビジュアルエディタ)ですが、欲しい機能が無かったり、使わない機能が表示されていたりしていませんか?。「TinyMCE Advanced」は、TinyMCEを拡張し、カスタマイズすることができるプラグインです。とりわけ、標準ではできなかったテーブルの挿入は、記事投稿の強い味方になってくれるでしょう。

 

 

◆「TinyMCE Advanced」のインストール

「プラグイン」>「新規追加」をクリック。

wordpress_tinymceadvanced01_1

検索で「TinyMCE Advanced」と入力し「プラグインの検索」ボタンをクリック。

wordpress_tinymceadvanced01_2

「TinyMCE Advanced」の「詳細」をクリック。

wordpress_tinymceadvanced01_3

「いますぐインストール」ボタンをクリック。

wordpress_tinymceadvanced01_4

「TinyMCE Advanced」の「プラグインを有効化」をクリック。

wordpress_tinymceadvanced01_5

有効化すると、ダッシュボードのサイドバーに「設定」>「TinyMCE Advanced」の項目が追加されます。続けて「TinyMCE Advanced」を設定していきましょう。

 

 

◆「TinyMCE Advanced」の設定方法

「設定」>「TinyMCE Advance」をクリック。

wordpress_tinymceadvanced02_1

「TinyMCE Buttons Arrangement」画面が表示されます。

wordpress_tinymceadvanced02_2

TinyMCE(ビジュアルエディタ)のアレンジ方法は簡単。灰色の四角の中にあるボタンをドラッグ&ドロップで灰色の太ラインに移動させるだけ。

wordpress_tinymceadvanced02_3

全部移動させて並べ替えたり、図のように実際に必要なボタンを移動させるだけでもかまいません。スタイルやフォーマットやテーブルの挿入など使える機能がそろっています。最後に「Save Changes」ボタンを押して、設定完了です。

 

 

◆「TinyMCE Advanced」の実装確認

変更前 →

変更後 ↓

編集画面でもこのように変更されています。今までできなかったことも大幅に増えました。使いこなし編集することで、高度にカスタマイズできることでしょう。

◆ Similar Posts

2 Comments »

Leave a comment!

Add your comment below, or trackback from your own site. You can also subscribe to these comments via RSS.

Be nice. Keep it clean. Stay on topic. No spam.

You can use these tags:
<a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <img localsrc="" alt="">

This is a Gravatar-enabled weblog. To get your own globally-recognized-avatar, please register at Gravatar.