WordPress初心者にも扱いやすいレンタルサーバー heteml
Post Image

WordPressテキストエディターのツール解説 標準ツール編

WordPressの投稿画面に標準で使われているヴィジュアル・テキストエディター(tinyMCE)の各ツールの使い方を解説します。標準ツール編ではWordPressインストール時の初期状態で使えるツールを説明します。

WordPressテキストエディター 標準ツール表

対象が「文字」の場合は選択されている文字にだけ適用されます。「行」の場合はカーソルのある行全体に適用されます。「カーソル位置」の場合はカーソルのある場所に挿入されます。

 が背景色のツールは見た目のスタイルを定義します。
これらのツールは、フォーマット解除(フォーマット解除)ツールで解除が可能です。

それ以外のツールは主に文章構造を定義します。設定を解除するにはアクティブになっているツールアイコンをクリックします。アイコンのアクティブ表示はブラウザーによって異なりますので注意してください。Firefox3.5やIE8では、アクティブ表示となりますが、IE6やIE7ではIE7のアクティブ表示となってわかりづらくなります。

「フォーマット」と「CSS編集」に関しては解除する方法はなく、設定を変更して元に戻します。「フォーマット」の場合は、フォーマット、または、段落を選びます。「CSS編集」の場合は設定した項目を空白にして更新します。

以下、ツールの解説です。

基本ツール(1列目)
アイコン機能
[code]
対象解 説
太字太字
[strong]
文字選択した文字を太字にする。
イタリックイタリック
[em]
文字選択した文字を斜体にする。
打ち消し打ち消し
[line-through]
文字選択した文字に打ち消し線を入れる。
番号なしリスト番号なしリスト
[ul]
このツールを選択中は番号なしリストになる
番号つきリスト番号つきリスト
[ol]
このツールを選択中は通し番号のリストになる
引用引用
[blockquote]
このツールを選択中は文章が引用扱いになる。スタイルはテーマの設定による。
左揃え左揃え
[left]
このツールを選択中は行を左揃えにする
中央揃え中央揃え
[center]
このツールを選択中は行を中央揃えにする
右揃え右揃え
[right]
このツールを選択中は行を右揃えにする
リンクの挿入/編集リンクの
挿入/編集
[a]
文字選択した文字をリンクにする。文字を選択した状態でリンクのツールアイコンをクリックすると設定ボックスが表示される。詳細はこちら
リンク解除リンク解除
[--]
カーソル位置カーソル位置にあるリンクを解除する
Moreタグを挿入Moreタグを挿入
[<!--more-->]
カーソル位置Moreタグをカーソル位置に挿入する。Moreタグを挿入するとタグ位置よりあとの文章は表示されず、「続きを読む」などのリンクが表示される。
スペルチェックOn/Offスペルチェック
On/Off
[--]
文字選択した単語のスペルチェックをする。英、独、仏などに対応。
フルスクリーンフルスクリーン
[--]
--このツールを選択すると編集エリアがフル画面になる。もう一度クリックして選択を解除すると通常の画面に切り替わる。
アドバンストツールバーの表示/非表示アドバンスト
ツールバーの
表示/非表示
[--]
--このツールを選択するとツールが拡張されアイコンが2列に表示される。もう一度クリックして選択を解除すると拡張ツール群が非表示になる。
アドバンストツール(2列目)
アイコン機能
[code]
対象解 説
フォーマットフォーマット
[--]
カーソル位置の行を選択したファーマットに変換する。
詳細はこちら
CSS編集CSS編集
[style]
カーソル位置の行のスタイルを編集する。CSSとHTMLの知識がある上級者向けのツール。
均等割付均等割付
[justify]
このツールを選択中は行を均等割付にする。機能させるためにはHTMLで記述を追加する必要がある。
文字色文字色
[color]
文字選択した文字の色を変更する。
テキストとして貼り付けテキストとして貼り付け
[--]
カーソル位置カーソルの位置にテキストを挿入する。アイコンをクリックすると設定ボックスが表示される。その中に挿入したいテキストを貼り付ける。このツールを使用しなくてもキーボードのCTRL+Vでテキストを貼り付けられるが、その場合、元のテキストのスタイルが保持されている。ツールを利用した場合は元のスタイルは保持されない。
Wordから貼り付けWordから
貼り付け
[--]
カーソル位置カーソルの位置にWordで作成したテキストを挿入する。アイコンをクリックすると設定ボックスが表示される。その中に挿入したいWordのテキストを貼り付ける。
フォーマット解除フォーマット
解除
[--]
文字選択した文字のスタイルを解除して初期状態に戻す。
解除できるスタイル:太字 イタリック 打ち消し 文字色
埋め込みメディアの挿入/編集埋め込み
メディアの
挿入/編集
[--]
カーソル位置カーソルの位置にFlashやQuickTimeなどを挿入する。ファイルのURLがわからない場合は、WordPress標準のメディアアップローダーでファイルをアップロードした後、そのファイルURLを挿入するとよい。
特殊文字特殊文字
[--]
カーソル位置カーソルの位置に® ∞などの特殊文字を挿入する。
インデントインデント
[padding-left: 30px;]
このツールを選択中は行をインデント(字下げ)する
インデント解除インデント解除
[--]
カーソルのある行のインデント(字下げ)を元に戻す
取り消し取り消し
[--]
--直前の変更を取り消す。キーボードのCtrl+zと同じ。
やり直しやり直し
[--]
--直前に取り消した変更を再度変更状態に戻す。キーボードのCtrl+yと同じ。
ヘルプヘルプ
[--]
--ヘルプ画面を表示する。

リンクの挿入/編集

リンク設定画面

リンクの挿入/編集(リンクの挿入/編集)ツールをクリックすると設定ボックスが表示されます。そこで必要項目を入力します。

  1. 「リンクURL」にリンク先のURLを入力します。(例:http://www.example.com/)
  2. 「ターゲット」を選択します。現在のウインドウでリンク先を開く場合は「このウインドウ/フレームで開く」を、新しいウインドウを開く場合は「新しいウインドウで開く」を選びます。
  3. 「タイトル」にリンク先を説明するタイトルを入力します。
  4. 「挿入」ボタンをクリックします。

フォーマット

「フォーマット」は現在カーソルがある行の構造を変更できます。初期状態ではどの行も「段落」になっています。変更できる構造は以下のとおりです。

フォーマットCODE説明
段落p文章の段落になります。通常、段落と段落の間には1行空きます。改行した場合は2つの段落に分かれます。同じ段落内で改行する場合は[Shift+Enter]にします。
アドレスaddress「アドレス」はドキュメントの作成者を表記するときに設定します。
整形済みpre「整形済み」は他の構造と違い、空白などを入力したままの状態で表示します。主にプログラムなどのソースコードの表記に使います。
見出し1~6h1~h6いわゆる見出しです。1が最も重要な見出しで数字が多いほど重要度が低くなります。通常は、重要なほど文字が大きくなります。

1 コメント/トラックバック

この記事に対してのコメントがありましたらコメントフォームから送信してください。

Trackbacks

  1. WordPress 初心者向け解説「新規投稿を追加するまで」 | フリッヂデザイン

    [...] WordPressテキストエディターのツール解説 標準ツール編 [...]

コメントフォーム