TinyMCE Advancedを使いクリック操作で文字を装飾し綺麗な記事を作る方法


TinyMCE Advancedは、サイトの記事を編集するときに様々な装飾を施すことができたり、表などを記事に載せたりできるプラグインです。

これを使えば、HTMLの知識がなくても記事を簡単に装飾できます。では、ご説明していきます。

TinyMCE Advancedを導入

Step.1

ワードプレスのダッシュボード→プラグイン→新規追加に入り、「TinyMCE Advanced」と検索してプラグインをインストールして有効化して下さい。

Step.2

タイニーメイス画像1

ダッシュボード→設定→TinyMCE Advancedを選択して下さい。

タイニーメイス画像2

下の枠に各種ボタンがあります。使いたいボタンをクリックしたまま上の空いたスペース(グレーの部分)に持って行くことで追加できます。

配置変更も同じ要領で出来ます。使わないボタンを削除する場合は、上の枠のボタンを下の枠に移すことで削除することができます。

以下、各種ボタンの大まかな説明です。

Horizontal rule:水平線

Hide next row:次の行を非表示

Quote:引用文(ブロックレベル)

Justify:均等割付

Cat:切り取り

Copy:コピー

Paste:貼り付け

Replace:置換え

Font family:フォントファミリー

Styles:スタイル

Clean Code:クリーンコード

Citation:引用

Table:テーブル

Inserted Text:要素の挿入

Deleted Text:要素の削除

Abbreviation:略語

Acronym:頭文字

Layer:レイヤー

Advanced HR:高度な水平線

View HTML:HTMLソース編集

Hidden Chars:制御文字の表示

NB Space:改行なしスペース挿入

Visual Aids:ビジュアルエイド

Insert Date:日付の挿入

Insert Time:時刻の挿入

Anchor:アンカー

IE Spell:IEのスペル

また、画像の下にある「Also enable」と書かれたチェックボックスは、使いたい機能にチェックを入れるとTinyMCE Advancedをもっと詳細に利用することが出来ます。

Advanced Image:

画像の細かい設定ができます。

Advanced List Options:

リストタグの細かい設定ができます。

Context Menu:

右クリックした時にTinyMCE Advanced専用メニューが立上がります。

タイニーメイス画像3

各種設定が完了したら、画面下の「Save Changes」をクリックして設定を保存して下さい。

画像の赤枠のチェックボックスは、TinyMCE Advancedが行うHTML やCSSの書き込み、読み込みなどを設定できる部分です。

HTMLやCSSがわからない方は無視して頂いて構いません。

Advanced Link:

記事に載せるリンクの細かい設定ができます。リンク機能が使えなくなる事があります。

Import editor-style.css.:

エディタ内にテンプレートのCSSを読み込ませることができます。(実際の画面とほぼ同じ表示が可能)

Hide all CSS classes in the editor menus.:

エディタメニュー内にあるCSSドロップダウンメニューを非表示にできます。

Stop removing the <p> and <br />tags when saving and show them in the HTML editor:

勝手に「<p>」「<br />」タグを削除しないようにできます。(enterを押して「<p>」タグを、shift+enterを押して「<br />」タグを挿入できます。)

Step.3

設定の保存が完了したら、投稿→新規追加に入って確認してみて下さい。

タイニーメイス画像4

このようになればOKです。

次ページ

12次

今回の記事はお役にたてましたでしょうか?

もし、今回の記事を読んで感想や分からない事などありましたら、下のフォームより僕にお伝え下さい。

些細な事でも構いません。

おそらく、あなたが抱いた疑問は、これからこの記事を読む方も抱く疑問です。

そういった疑問を1つ1つ解決していきます。

コメントして頂ければ気づき次第、すぐに回答いたします。

このブログは、

・アフィリエイト開始初月から9万円のネット収入が得られた秘密

アフィリエイト開始2ヶ月目で以前勤めていた会社からの給料と
 同額
のネット収入を確保した方法

・5ヶ月目で月収120万円を達成した最先端テクニック

・これから流行り始めるブログマネタイズの新しい思考法

などを書いています。

只今、ブログの内容をより体系的にまとめたビジネス教科書を
無料でプレゼントしています。

以下のフォームに教科書を受け取るメールアドレスと、
あなたの苗字を記入してプレゼントをお受け取り下さい。





記事一覧


著者:ヒデアキ
現在は、毎月100万円の収入を得ているブログアフィリエイトの知識を活かして「新たな収入源を手に入れ大切な人を守りたい」と真剣に考えている方を全力でサポートしています。
更に詳しいプロフィールはこちら


このページの先頭へ