２：リッチテキストエディタ

１：リッチテキストエディタとは？

　ココログの記事の投稿・編集は、「リッチテキストエディタ」と「プレーンテキストエディタ」を切り替えて使用することができます。
　「リッチテキストエディタ」では、記事作成画面での見え方が、記事を公開した後のブログの画面上で表示される見え方に近い状態となります。この機能を使えば、 HTML が苦手な方でも、文字の色や文字の大きさの変更、写真の挿入などがボタンをクリックするだけで簡単に行えます。思いのままに記事を作成することができます。

※Mac ユーザーの方は、FireFox でのみ「リッチテキストエディタ」をご利用いただけます。それ以外のブラウザでは「プレーンテキストエディタ」となります。

２：リッチテキストモード

　ココログの編集画面は、初期設定では「リッチテキスト」モードになってます。編集画面がリッチテキストモードかプレーンテキストモードかを確認したい場合には、「記事の作成」画面の緑色で書かれている「この編集画面の表示設定を変更する」をクリックします。すると別ウインドウで編集モードの切替画面が現われます。

　ここで「プレーンテキスト」にチェックが入っている場合、「リッチテキスト」にチェックを切り替え、画面１番下の「保存」をクリックします（初期設定では「リッチテキスト」が選ばれています）。すると、「新規記事を作成」画面が「リッチテキストモード」に切り替わり、記事投稿画面の本文エリア右上に「記事の作成」と「HTML の編集」の２つのタブが現われます。

　「新規記事を作成」画面をリッチテキストに変更したら、まずは記事本文を入力し、文字の表示を変更したい部分を選択して「フォントサイズ」「太字」「フォントカラー」「取り消し線」などの各種メニューアイコンをクリックしてみましょう。するとその場で、選択された部分が指定したスタイルに変化します。

　「記事の作成」タブで行った操作は「HTML の編集」タブにも反映され、切り替えると自動的に HTML が記述されていることが確認できます。

　「HTML の編集」タブで直接 HTML を編集することもできますが、使える HTMLタグには制限があります（table は使用可）。HTML の直接入力に慣れている方は「プレーンテキスト」モードでのご利用をお勧めします。

　画像を記事に貼りたい場合は、山のイラストが書いてある、「IMG」アイコンを使うと、画像アップロードのためのポップアップウインドウが表示されます。

　ウインドウ内の「画像の選択」から「参照」ボタンをクリックして、ブログにアップロードしたい画像データをあなたのパソコン上から選択し、「画像の挿入」ボタンをクリックしてください。すると本文エリアに画像が表示されるので、マウスでドラッグするだけで簡単に好きな位置にレイアウトできます。
　画像アップロードについての詳しい方法は「ブログへの画像／ファイルのアップロード」で確認してください。

　記事の編集が終わったら「確認」をクリックし、レイアウトを確認します。
　問題なければ「保存」をクリックして投稿は完了です（記事を編集しなおしたい場合には、「再編集」をクリックして、記事作成画面に戻ってください）。

　リッチテキストエディタを使えば、文章や画像にさまざまな変化をつけることが簡単になります。

３：プレーンテキストモード

　「プレーンテキスト」モードでも、「リッチテキスト」同様に「フォントサイズ」「太字」「フォントカラー」「取り消し線」などの各種メニューアイコンを使って本文を加工することができます。
　ただし、「リッチテキスト」モードが実際にブログで表示される見た目に近い状態で編集できるのに対し、「プレーンテキスト」ではすべて HTML タグによってテキストで表示されます。HTML の直接入力に慣れている方は「プレーンテキスト」の利用をお勧めします。また、動作も「プレーンテキスト」モードの方が「リッチテキスト」モードよりも若干スピーディになります。

　また、IE７を使ってプレーンテキストで記事作成を行っているとき、「リンク」と「メール」ボタンをクリックするとIEの情報バー（※）が表示されます。

※「この Web サイトは、スクリプト化されたウィンドウを使用して情報を依頼しています。この Web サイトを信頼している場合、ここをクリックして、スクリプト化されたウィンドウを許可してください。」

　これは、IE７のセキュリティ強化によるブラウザの制限で起こるものです。これが表示されたときは、IE７メニューバーにて、

ツール(T) > インターネットオプション(O) > 「セキュリティ」タブ　>　信頼済みサイト

を選択、「サイト(S)」ボタンをクリックし、サイトの URL を「信頼済みサイト」へ追加することで正常に動作します。

４：記事を装飾しよう

　 本文の入力エリアには、上部にアイコンの並ぶツールバーが表示されています（Macintosh では、FireFox をお使いの場合のみ表示されます）。テキストを選択してそれぞれメニューアイコンをクリックすることで、リッチテキストモードの「記事の作成」画面では、直接テキストの表示が変更され、「HTML の編集」およびプレーンテキスト画面ではタグが加えられます。（※ブラウザーによっては、テキストを選択せずにアイコンを押した場合でも、カーソル位置の前後の文字列に効果が加えられることがあります）。メニューアイコンでは、選択した文字について以下の装飾ができます。左から順番に説明していきましょう。

●フォントサイズ
　本文のフォントサイズを変更できます。サイズは「最小」「小」「普通」「大」「最大」の５種類で、通常は「普通」が選択されています。本文の一部を選択してサイズ変更することで、テキストだけでビジュアル的な演出をすることも可能になります。ただ、この機能は、「フォントカラー」と一緒に使うとサイズが反映されない場合があります。
　なお、この機能はプレーンテキストモードにはありません。

●太字
　選択したテキストを太字にします。

●斜体
　選択したテキストを斜体にします。

●下線
　選択したテキストに下線を入れます。

●取消線
　選択したテキストに取消線を入れます。

●フォントカラー
　 本文のフォントの色を変更できます。アイコンをクリックするとパレットが表示されるので、好みの色を選ぶことで入力する文字の色を変えることができます。
　また、すでに書かれた本文の一部を選択してこのボタンを押せば、強調したい部分をカラフルに見せることもできます。ただ、この機能は、「フォントサイズ」と一緒に使うとサイズが反映されない場合があります。
　なお、この機能はプレーンテキストモードにはありません。

●リンクボタン
　ほかのサイトへ飛ぶためのリンクを挿入します。
　「リッチテキスト」モードの「記事の作成」画面でこのボタンをクリックするとアドレス（URL）を入力するためのウインドウが開きます。
　フォームにアドレス（URL）を入力し「OK」をクリックすると、続いてリンクを貼る文字を入力するウインドウが開くので、文字列を入力します。「OK」をクリックすれば本文にリンクコードの入った文字列が挿入されます。
　リッチテキストモードの「HTML の編集」画面、およびプレーンテキストモードでは、本文中のリンクを貼りたい部分を選択してからボタンをクリックします。するとアドレス（URL）入力ウインドウが開くので、アドレス（URL）を入力します。すると自動的に本文中にリンクタグが貼られます。

●メールボタン
　メールアドレスへのリンクを挿入します。
　「リッチテキスト」モードの「記事の作成」画面でこのボタンを押すとメールアドレスを入力するウインドウが開きます。
　フォームにアドレスを入力すると、本文にメールアドレスへのリンクコードの入った文字列が挿入されます。
　「リッチテキスト」モードの「HTML の編集」画面、および「プレーンテキスト」モードでは、本文中のリンクを貼りたい部分を選択してからボタンを押します。するとメールアドレス入力ウインドウが開くので、アドレスを入力してください。自動的に本文中にリンクタグが貼られます。

●引用ボタン
　テキストを引用タグで囲み、その部分が引用であることを表現します。
　「リッチテキスト」モードの「記事の作成」では、引用を開始する部分へカーソルを持っていき「引用の開始」ボタンを、引用を終了する部分でも同様に「引用の終了」ボタンをクリックします。
　「リッチテキスト」モードの「HTML の編集」画面、および「プレーンテキスト」モードでは、引用部分を選択し、ボタンをクリックすることで引用タグが挿入されます。

●列挙リスト・順序リスト
　テキストの行頭に中点（列挙リストの場合）、または番号（順序リストの場合）を振り、リストにします。カーソルが置かれている段落、選択した部分が含まれる段落に対して有効となります。リストを解除したい場合、リストを選択してボタンを再度クリックすると元に戻ります。

●画像挿入ボタン
　文中に画像を挿入します。詳しい使い方は「ブログへの画像／ファイルのアップロード」で説明します。

●ファイル挿入ボタン
　文中にファイルを挿入します。詳しい使い方は「ブログへの画像／ファイルのアップロード」で説明します。

●絵文字挿入ボタン
　クリックすると絵文字パレットが表示され、文中に絵文字を挿入することができます。絵文字をふたつ以上連続して挿入する場合は、シフトキーを押しながら絵文字をクリックしてください。

※「リッチテキスト」モードで利用すると絵文字表記されますが、「プレーンテキスト」モードでは[e:apple]といったようにタグ表記されます。実際のブログでは絵文字で表記されます

※「Netscape７」や Mac の「Internet Explorer５」など、一部のブラウザでは絵文字入力ができません

●お絵かきボタン
　お絵かきボタンをクリックするとお絵かき用パレットが表示され、マウスを使ってイラストを作成することができます。
　ここで作成したイラストは、パレット内の「保存」ボタンをクリックすると記事作成欄内にhtmlタグが挿入され、ブログ記事上に表示させることができます。

※お絵かきツールは、最新の Adobe Flash Player がインストールされていないと表示されません。詳しくは「お絵かきツールが表示されません」をご覧ください。

●顔文字挿入ボタン
　絵文字挿入ボタンと同様、クリックすると顔文字パレットが表示され、クリックすることで文中にその顔文字を挿入することができます。顔文字をふたつ以上連続して挿入する場合、Windows の場合は「コントロールキー」、Macintosh の場合は「alt (option) キー」を押しながら顔文字をクリックしてください。

●動画挿入ボタン
　動画挿入ボタンをクリックすると、@nifty ビデオ共有のウインドウが表示されます。こちらからブログに貼りたい画像を選択してください。
※動画挿入ボタンは、記事の作成・編集画面が「プレーンテキストモード」に設定されている時のみ表示されます。「リッチテキストモード」ではご利用できません。
※@nifty ビデオ共有の利用が初めて、あるいはログアウト状態の場合、ログイン画面が表示されます。ログイン画面からリンクされている解説を読み、アカウントを取得した上でご利用ください。

●本ボタン（フリー）
　
　文中に書籍へのアフィリエイトリンクと商品レビューを簡単に挿入することができます。詳しくは「アフィリエイト」で解説しています。

●CDボタン（フリー）
　文中にCDへのアフィリエイトリンクと商品レビューを簡単に挿入することができます。詳しくは「アフィリエイト」で解説しています。

●アフィリエイトボタン（フリー）
文中に各種商品へのアフィリエイトリンクを張ることができます。詳しくは「アフィリエイト」で解説しています。

５：編集画面の表示設定

　記事の投稿・編集画面は、「プレーンテキスト」モードと「リッチテキスト」モード以外に、「基本」「上級」と分かれています。ここでは「上級」の使い方を説明します。これは「プレーンテキスト」「リッチテキスト」両モード共通の機能です。
　記事の投稿・編集画面で「この編集画面の表示設定を変更する」をクリックすると、「編集モード／編集画面の表示設定／『保存』『確認』ボタンの位置」ウインドウが開きます。
　ここで「編集画面の表示設定」から「上級」を選び「保存」をクリックすると、記事の投稿・編集画面に「本文（続き）」「概要」「トップに表示」が追加されます。「プレーンテキスト」モードを選択している場合、「改行設定」も表示されます。

▼「保存」「確認」ボタンの位置

　記事を投稿するときの「保存」「確認」ボタンの場所も、 編集画面の一番上か下を選択できます。ノートパソコンなど小さめのモニタを使っている人は「上」にしておくと便利です。

▼本文（続き）
　「本文（続き）」欄に書いた記事は、ブログのトップページには表示されず、記事の最後に「続きを読む…」というリンクが現れます。ここをクリックすると「本文（続き）」欄に書いた記事の全文を読むことができます。長い文章を書いたときや、後から記事をアップデートしたいときなどに使ってください。

▼概要
　「概要」欄には、記事の内容を短くまとめて書き込みます。ここに書かれた「概要」はトラックバックした相手先のブログに表示されたり、ココログトップページの新着記事に掲載されたり、RSS リーダーなどでブログの情報を読み込む際などに使われます。ここに何も書かなければ、ココログは記事の最初から40文字を、その記事の「概要」として使います（概要の文字数設定は自分で変更できます）。

　「改行設定」では「なし／改行を反映／Markdown」が選択できます。HTML を自分で記述したい方以外は、設定を「改行を反映」にします。
　「Markdown」を選ぶと、様々なタグを利用して記事を作成することが可能となります。Markdown の記法には次のようなものがあります。

項目名	記法	HTMLタグに変換
見出し1（h1）	# 見出し1 #	<h1>見出し1</h1>
見出し2（h2）	## 見出し2 ##	<h2>見出し2</h2>
見出し3（h3）	### 見出し3 ###	<h3>見出し3</h3>
強調	*強調*　（代表的なブラウザでは斜体で表示します）	<em>強調</em>
強い強調	**強い強調**（代表的なブラウザでは太字で表示します）	<strong>強い強調</strong>
引用文	> 引用文	<blockquote>引用文<blockquote>
箇条書き	* リスト1 * リスト2 * リスト3	<ul> <li>リスト1</li> <li>リスト2</li> <li>リスト3</li> </ul>
順序リスト	1. リスト1 1. リスト2 1. リスト3	<ol> <li>リスト1</li> <li>リスト2</li> <li>リスト3</li> </ol>
画像の挿入		<img src=”/img/test.jpg” alt=”ALT” />
リンク	[リンク](http://example.net/)	<a href=”http://example.net”>リンク</a>
プログラムコードの記述	テスト	<pre><code>テスト</code></pre> 　（行頭に半角スペース4つ、またはタブを挿入すると、preタグとcodeタグの両方で囲います）

※「改行設定」は「リッチテキスト」モードでは表示されません。

６：ウェブページを作成する

　ココログでは、ブログ記事とは別にウェブページを作成することができます。ウェブページはほぼブログ記事と同じように見えますが、公開日等の指定はなく、過去ログとは別のページとなるため、ブログ全体の解説や目次等への利用に向いています。
　ウェブページの作成・公開方法については、「ウェブページを作る」で解説しています。

７：「リッチテキストエディタ」の FAQ

・FAQ:改行したつもりが１行分のスペースができてしまう
・FAQ:記事を編集したら一部のタグが消えた？
・FAQ:リッチテキストモードの改行ルール
・FAQ:プレーンテキストモードで引用文の後で改行が反映されない