#05「TinyMCE Advanced」


 

このプラグインは簡単に言うと、ビジュアルエディタ(投稿機能)を拡張し、カスタマイズ性に優れているのでとても作業効率が上がり、簡単に投稿できるようにサポートしてくれるものです。

ブログを書き始める前に、便利なプラグイン「TinyMCE Advanced」のインストール・設定をおすすめします!

 

プラグイン「TinyMCE Advanced」の設定

まずはインストールしましょう!

インストール方法はこちら「素人ホームページ制作!厳選プラグイン!#01 プラグインって何?〜インストール方法」をご覧ください。

 

デフォルトのビジュアルエディタ

インインストール前は、ボタンも少なくとてもシンプルです。

インストール後のビジュアルエディタ

ビジュアルエディタで利用できるボタンが増え、ブログサービスやワードソフトに近い感じになります。

 

それでは早速設定をしてみましょう!

メニューの設定からTinyMCE Advancedをクリック。

設定画面を開くと、たくさんのボタンが並んでいます。

上部ツールバーは現在使用中のボタンです。

必要なボタンを使用しないボタンエリアから上部のツールバーへドラッグ&ドロップ、使用しないボタンを上部ツールバーから使用しないボタンエリアへドラッグ&ドロップ。

また、ツールバーの中でドラッグ&ドロップで、順番を並び替えることができます。

設定が終わったら、右上の「変更を保存」をクリック。

 

エディターメニューを有効化する

「エディターメニューを有効化する」にチェックを入れると、エディタの上部にプルダウンメニューバーが表示され、TinyMCE Advancedで使用できる全ての機能が確認できます。

通常はボタンを使用して記事の作成を行い、使用頻度の高いボタン以外の機能を利用する時は、プルダウンメニューバーから使用します。

 

設定

リストスタイルオプションとフォントサイズの2箇所にチェックを入れます。

チェックを入れたらページ下部にある「変更を保存」をクリックし設定を保存します。

 



 

TinyMCE Advanced使用方法

ビジュアルエディタとテキストエディタ

投稿の編集画面で、右上のビジュアルボタンとテキストボタンで切り替えができます。

テキストエディタはHTMLタグの知識が必要になります。

ビジュアルエディタはHTMLタグを知らない方でも投稿記事を作ることができます。

 

ツールバー切り替え

自分で設定したエディタボタンを全て表示します。

※ ツールバー切り替えボタンは、一段目の右端に置かなければうまく機能しないので要注意!

 

段落(見出し)

見出しにしたい文章を選択し、ビジュアルエディタの段落をクリックすると見出し1〜6までプルダウンで表示されるので、任意で選びます。

タイトルが見出し1になるので、見出し2から使うようにします。

 

フォントファミリー・フォントサイズ・文字装飾

 

    

フォントサイズや装飾を変更するには、変更したい文章を選択し、任意で選びます。

 

文字揃え

   

文字を左寄せ、中央揃え、右寄せ、両端揃えのいずれかでの表示を選択し、クリックします。

 

リスト表示

 

テキストを番号なしリストや番号付きリストで表示したい時に使用するボタンです。

リスト表示したい箇所を選択し、どちらかのボタンを選択しクリックします。

 

リンクの挿入/編集

リンクを挿入したい箇所を選択し、リンク挿入/編集ボタンをクリックします。

リンクの挿入/編集画面で、リンク先のURLを入力します。

 

リンクの削除

リンクを削除したい箇所を選択し、リンクの削除ボタンをクリックします。

 

引用

他のサイトや書籍などから引用してきたテキストに対して使用するボタンです。

引用として表示したい部分を選択し、引用ボタンをクリックします。

 

テーブル(表)の挿入

簡単な表(テーブル)を作成、挿入します。

 

「続きを読む」タグを挿入

トップページに表示された最新記事の記事内容を任意の箇所で「続きを読む」というボタンを挿入し、表示される記事の文字量を縮小します。

投稿記事の任意の場所に一段分のスペースを空け、カーソルを合わせた状態で、「続きを読む」タグを挿入ボタンをクリックします。

 

メディアを挿入/編集

YouTubeの埋め込みコードを使用して、投稿記事内にYouTube動画を表示します。

 

横ライン

水平の線を記事の中に挿入します。

横ラインを入れたい箇所にカーソルをあわせ、横ラインボタンをクリックすると、横ラインが挿入されます。

 

まとめ

いろいろ触っているうちに、なんとなく感覚でわかってくると思いますので、便利そうなボタンを足していって自分なりの設定をしてみてください。

私のおすすめは、デフォルトのままだと、YouTube動画の埋め込みが出来ないのですが、「メディアを挿入/編集」ボタンを使うと簡単にYouTube動画の埋め込みができるようになります。

あと「エディターメニューを有効化する」にチェックを入れると、ツールバーの上にプルダウンメニューバーが出るので、これも結構便利ですね。

 

という事で今回はここまで。

最後まで読んで頂きありがとうございました。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です