おてもやんはじめ　2nd

記事投稿画面の中でも記事の投稿に必要なメイン部分を説明していきます。



はタイトル入力欄です。
記事を投稿するには最低限、タイトルと本文が必要です。

はカテゴリーがある場合に記事のカテゴリーを選択するのに使います。
「追加」のボタンをクリックすると別ウィンドウが表示されます。



入力欄に作成したいカテゴリー名称を入力して「カテゴリーの登録」ボタンをクリックするとカテゴリーが追加されます。

はツールパレットといって、記事本文や追記の文字を装飾したり画像を挿入したりするときに使います。

は本文入力欄です。
記事を投稿するには最低限、タイトルと本文が必要です。

は入力領域の伸縮に使います。
入力欄の横▲をクリックすると入力欄が小さく、▼をクリックすると入力欄が大きくなります。
本文や追記の入力欄の横、右下にある▲や▼上下の三角をクリックすると、入力欄が伸縮します。





小さすぎても大きすぎても使いにくいと思いますが、ちょっと小さくしてタグ入力欄「確認」ボタンなどの本文以下の表示を近くしたり、少し大きく広げて長文の記事を書くときに便利です。

の「追記」の文字リンクをクリックすると追記欄が表示されます。
(表示されているときに「追記」の文字リンクをクリックすると追記欄が非表示になります)
追記入力欄にはツールパレットがあり、記事本文同様に文字の装飾ができます。

はタグ入力欄です。
おてもやんでは1つの記事に対してタグを5つまで設定することができます。
また、「▼タグ一覧」の中から、おてもやんのおすすめタグや過去タグを選択すると、それぞれのタグを表示させることができます。
使いたいタグを1回クリックするとタグ入力欄の1つに自動で挿入されます。

の上下にある「実際の表示をプレビュー 」の文字リンクをクリックすると、投稿前でも実際使っているテンプレートでどのように反映されるか別ウィンドウで表示されます。

はブログの公開設定を選ぶときに使います。
「公開」を選ぶと投稿した記事がそのままブログに反映されます。
「下書き」を選ぶと記事を投稿してもブログには反映されません。
※下書きにした記事を公開したい場合は記事の一覧画面よりもう一度その記事を「公開」設定にして投稿してください。

の「確認せずに保存」の左側にあるチェックボックスにチェックを入れると「確認」ボタンを押したときに表示される確認画面を飛ばして、投稿することができます。

タイトルや記事を入力したら、この「確認」ボタンをクリックして、記事の確認･登録をします。  

記事投稿画面のツールパレットについて説明します。
先に文字を装飾する部分から説明します。



文字に対する装飾やリンクをするときは先に装飾したい文字を選択する必要があります。
装飾したい文字をドラッグ(マウスのボタンを押したままの状態でマウスを移動)するか
装飾したい文字の最初か最後にカーソル(入力欄内で点滅する|　←こんな棒)を入れて
キーボードのシフトキーを押しながらキーボードの矢印キーを押していくと押した方向に文字が選択され、
選択された文字が青く反転して表示されます。



文字装飾ボタンはこのように文字を選択した状態で使い、選択されている文字に対して文字を装飾します。
文字を選択した状態でそれぞれのボタンをクリックすると対応のタグが自動で挿入されます。

　:文字サイズ変更ボタン
文字の大きさを変更するときに使います。
装飾したい文字を選択した状態で文字を拡大ボタンをクリックすると選択した文字が大きくなります。
装飾したい文字を選択した状態で文字を縮小ボタンをクリックすると文字が小さくなります。
記事投稿画面からの文字サイズの変更は選択中に複数回クリックすることで効果を重ねることができます。
文字選択後文字を大きくボタンを2回クリックした状態
文字選択後文字を小さくボタンを2回クリックした状態
※あまり大きすぎる文字や小さすぎる文字だと記事が読みにくくなります。

:強調ボタン　:斜体ボタン　:打ち消し線ボタン　1つ飛んで:下線ボタン
装飾したい文字を選択した状態で強調ボタンをクリックすると文字が太字になります。
装飾したい文字を選択した状態で斜体ボタンをクリックすると文字が斜体になります。
装飾したい文字を選択した状態で打ち消し線ボタンをクリックすると文字に横線が入ります。
装飾したい文字を選択した状態でをクリックすると文字の下に線が付きます。
このボタンは文字を選択中に何度押しても効果を重ねることはできません。
文字選択中に太字で斜体や大きくしてアンダーラインのように他の文字装飾ボタンと組み合わせて使うことができます。

:引用文ボタン
装飾したい文字を選択した状態で引用文ボタンをクリックすると

文字の上下に改行が入り、文章の左右に余裕ができます。文章の左右に余裕ができます。文章の左右に余裕ができます。文章の左右に余裕ができます。文章の左右に余裕ができます。

:文字色変更ボタン
装飾したい文字を選択した状態で文字色変更ボタンをクリックするとカラーパレットが表示されます。



カラーパレット上の指先カーソルが指している色と上の方にある「文字の色をカーソルでお選びください。」の文字色は同じなのでどんな感じになるか確認ができます。
変更したい色が決まったらその色の上でクリックすると選択していた文字の色が選んだ色になります。

:リンクボタン
リンクにしたい文字を選択した状態でリンクボタンをクリックするとダイアログが表示されます。



入力欄の中にリンク先のURLを入力して、「OK」ボタンをクリックしてください。

※IEの場合は先にリンク先のURLをコピーしておくと自動的にコピーしておいたURLが入った状態でダイアログが表示されます。

「OK」ボタンをクリックすると、また、ダイアログが表示されます。



どちらかのボタンをクリックすると選択した文字にリンクが設定できます。
「OK」ボタンをクリックするとリンク文字をクリックしたときに、リンク先が別ウィンドウで表示されます。
「キャンセル」ボタンをクリックするとリンク文字をクリックしたときに、リンク先が同じウィンドウで表示されます。

　　:レイアウトボタン
装飾したい文字を選択した状態で左寄せボタンをクリックすると
装飾したい文字を選択した状態で中央寄せボタンをクリックすると
装飾したい文字を選択した状態で右寄せボタンをクリックすると

記事を確認･登録すると文字装飾をした記事が投稿できます。  

記事に画像を挿入するにはツールパレットのこの部分を使います。



自分が持っている画像をアップロードして記事に挿入する場合は左側の画像挿入ボタンと画像一覧から挿入ボタンを使います。

画像挿入ボタンでは画像を1枚ずつアップロードして挿入することができます。
画像一覧から挿入ボタンからは画像をまとめてアップロードしたり、以前アップロードした画像の中から選んだ画像を連続して記事内に挿入することができます。
おてもやんではgif、png、jpg、jpeg、avi、mov、wmv、mpg、mpeg、mp4、3gp形式のファイルのアップロードが可能です。
アップロードできるファイルサイズは最大2000KBまでです。

また、おてもやんに登録されている絵文字を挿入するときは右側の絵文字ボタンを使います。

画像を挿入する場合は画像を挿入したい位置にカーソル(入力欄内で点滅する|　←こんな棒)を置いて、ボタンをクリック後開くウィンドウでファイルを選択して、アップロード･挿入するとカーソルのあった位置に画像タグが挿入されます。

簡単な絵文字の挿入から説明します。
絵文字を挿入したい位置にカーソルを置き、画像挿入ボタンをクリックすると絵文字の読み込み後、絵文字パレットが表示されます。



スクロールして表示されていない絵文字を見ることもできます。
パレットの中から挿入したい絵文字を見つけたらクリックするとパレットが閉じ、カーソルのあった位置にクリックした絵文字の画像タグが挿入されます。

間違って画像挿入ボタンをクリックしてしまった場合は下にスクロールすると「閉じる」の文字リンクがあるのでクリックすると絵文字を挿入せずに絵文字パレットを閉じることができます。



記事を確認･登録すると絵文字を挿入した記事が投稿できます。  

画像を挿入する場合は画像を挿入したい位置にカーソル(入力欄内で点滅する|　←こんな棒)を置いて、ボタンをクリック後開くウィンドウでファイルを選択して、アップロード･挿入するとカーソルのあった位置に画像タグが挿入されます。
おてもやんではgif、png、jpg、jpeg、avi、mov、wmv、mpg、mpeg、mp4、3gp形式のファイルのアップロードが可能です。
アップロードできるファイルサイズは最大2000KBまでです。

画像挿入ボタンからは画像を1枚ずつアップロードして挿入することができます。

1枚ずつ画像を挿入したい位置にカーソルを置き、画像挿入ボタンをクリックすると画像・動画の挿入画面が別ウィンドウが表示されます。



1)でアップロードするファイルを選択します。
の「参照...」ボタンをクリックしてアップロードしたい画像を選びます。
「参照...」ボタンをクリックするとファイル選択のダイアログが表示されます。



アップロードしたいファイルを選択して「開く」ボタンをクリックすると「参照...」ボタンの横の欄に画像までのパスが自動で挿入され、のエリアにアップロードしたい画像のイメージが表示されます。



※縦横比が変わってしまう場合があります。
これでアップロードするファイルの選択が終了しました。

2)で記事へ挿入される画像に対する設定を行います。
ファイルサイズ:ではアップロードする画像の大きさをそのままのサイズでアップロードするか、横幅を指定して縮小してアップロードするかを選択します。
「オリジナルサイズ」を選択するとアップロードしようとしているファイルそのままのサイズでアップロードされます。
「リサイズ(画像縮小)」を選択すると、アップロードしようとしている画像のサイズの横幅を指定したpx数にしてアップロードします。
リサイズする場合は横幅:の横の入力欄に30～2048までのサイズ指定を入力します。
※縮小する場合も、最初のファイルサイズが2,000KB以上だとアップロードできません。
また、元の画像の大きさより大きくはできません。

表示方法:では記事に挿入したときの表示方法の選択をします。
「そのまま」を選択すると記事内にアップロードした画像の大きさそのままで画像が挿入されます。
「サムネイル」を選択すると記事内に横幅100pxの縮小画像が挿入され、画像をクリックするとアップロードしたサイズで別ウィンドウに表示されます。

回り込み:では画像と文字の位置を選択します。
なしを選択すると画像の下のラインに前後の文字列が1行だけ入ります。
前の文字列前の文字列前の文字列前の文字列後の文字列後の文字列後の文字列後の文字列

左寄せを選択すると画像が左側に表示され、文字列が上から右側に回り込んで表示されます。
前の文字列前の文字列前の文字列前の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列

中央揃えを選択すると画像の前後に改行が入り、画像が中央に表示され、画像の上下に文字列が表示されます。
前の文字列前の文字列前の文字列前の文字列

後の文字列後の文字列後の文字列後の文字列

右寄せを選択すると画像が右側に表示され、文字列が上から左側に回り込んで表示されます。
前の文字列前の文字列前の文字列前の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列後の文字列

これで画像挿入時のオプション設定が終了です。

1)ファイルの選択と2)オプション設定が終わったら3)挿入で画像をアップロードして記事に挿入します。
の「同じ名前のファイルを上書きする」にチェックを入れずにおくと、画像ファイルの上書きを防ぐことができます。
チェックを入れると、上書きのダイアログが表示されるので「OK」ボタンをクリックしてください。



アップロードしようとしている画像と同じ名前のファイルが既にアップロードされている場合に、以前アップロードした画像を新しくアップロードした画像に上書きしてしまいます。
今までアップロードした画像を差し替えて変更する以外はチェックを入れないでおくことをおすすめします。
※もう一度チェックをクリックするとチェックが消えて上書きできなくなります。

「記事に入れる」ボタンをクリックすると画像挿入のダイアログが表示されます。



画像を挿入する場合は「OK」ボタンをクリックしてください。
ウィンドウが自動的に閉じ、設定した条件で画像をアップロードし、記事内のカーソルを置いてあるところに画像を挿入します。
「キャンセル」ボタンをクリックするとダイアログが消え、画像は挿入されず画像・動画の挿入へ戻ります。

上書きしない設定で同名のファイルがあった場合やファイルサイズが大きすぎた場合、ファイル形式が違った場合はのエリアの下に赤字で警告が表示されます。






警告に従ってもう一度ファイルを選択しアップロード･挿入してください。

記事を確認･登録すると画像を挿入した記事が投稿できます。  

画像を挿入する場合は画像を挿入したい位置にカーソル(入力欄内で点滅する|　←こんな棒)を置いて、ボタンをクリック後開くウィンドウでファイルを選択して、アップロード･挿入するとカーソルのあった位置に画像タグが挿入されます。
おてもやんではgif、png、jpg、jpeg、avi、mov、wmv、mpg、mpeg、mp4、3gp形式のファイルのアップロードが可能です。
アップロードできるファイルサイズは最大2000KBまでです。

画像一覧から挿入ボタンからは画像をまとめてアップロードしたり、以前アップロードした画像を選んで挿入することができます。

画像を挿入したい位置にカーソルを置き、画像一覧から挿入ボタンをクリックすると画像一覧の挿入画面が別ウィンドウが表示されます。



画像一覧の挿入画面にはファイルのアップロードをする部分とファイル一覧を表示している部分があります。
また、スクロールすると下にある画像を見ることができます。

画像をアップロードする場合はファイルのアップロードの部分からファイルをアップロードします。



基本的に1枚ずつ画像を挿入と同じ使い方です。

の「参照..」ボタンをクリックしてファイル選択のダイアログを表示させて、アップロードしたい画像を選択します。



ファイルを選択したら「開く」ボタンをクリックすると、「参照...」ボタン横の入力欄に画像のパスが自動で挿入されます。

で同名の画像がある場合、上書きするか上書きしないかを選択します。
チェックを入れないと上書きされません。
チェックを入れると同名のファイルがある場合は上書きされます。
※特に目的がない場合は上書きしないことをおすすめします。

でアップロードするファイルの大きさを変更するかどうかを選択します。
オリジナルサイズを選択するとそのままのサイズで、リサイズを選択して横幅を30～2048の間の数字を入力すると入力した横幅のサイズに変更された画像がアップロードされます。

設定が終わったらの「アップロード」ボタンをクリックすると画像がアップロードされて、下にあるファイル一覧の表示の一番上に追加されます。
※1枚ずつ画像を挿入する場合と違い、ファイルのアップロードだけなのでアップロードのダイアログは表示されません。



上書きしない設定で同名のファイルがあった場合やファイルサイズが大きすぎた場合、ファイル形式が違った場合、ファイル選択の上に赤字で警告が表示されます。







警告に従ってもう一度ファイルを選択･アップロードしてください。

ここまでで画像のアップロードができたことになります。
1枚ずつ画像を挿入と違い、画像をすぐ挿入することはできませんが、続けて画像をアップロードすることができます。

※画像アップロード中に別の画像をアップロードすると画像が完全にアップロードされずに壊れることがあります。
先にアップロードした画像がファイル一覧に表示されてから、次の画像をアップロードしてください。

画像を挿入する場合はファイル一覧の部分から挿入します。



画像を挿入する場合はの設定を選んでクリックします。

には現在アップロードされている容量/このブログで使用できる画像容量が表示されます。
使用できる画像容量とアップロードされている画像容量の数字が同じになると画像がアップロードできなくなります。

には現在アップロードされているファイル数が表示されます。

にはこのブログで使用できる容量中、現在アップロードされている画像の割合がグラフで表示されます。
黄色のラインがいっぱいいっぱいになると、そのブログで画像をアップロードすることができなくなります。

には現在表示されている画像が何件中、どのあたりかが表示されます。
ファイル一覧には通常20件まで画像が新しくアップロードした順に表示されます。

画像が20件以上あるときのの数字をクリックすると現在表示されている以外の画像ページへ移動します。
画像挿入ボタンをクリックした時点で最新の20件が表示されるのでそれ以前の画像を探すときは数字をクリックしてください。
数字が大きい方が古いファイルになります。

の「次へ」の文字リンクをクリックすると現在表示されている以前にアップロードした画像を20件表示します。
昔の画像を表示しているときは、「前へ」の文字リンクが表示され、クリックすると表示していた画像より新しい画像が20件表示されます。

にはアップロードされた画像のサムネイル(縮小画像)が表示されます。
この画像が欠けていたり、表示されていない場合は画像が壊れている場合があります。

にはアップロードした画像のファイル名が表示されます。
同名ファイルがある場合などはこちらの名前であがっているファイルを調べることができます。

の部分は画像を挿入するときの回り込みの選択になります。
上の段はそのまま挿入する設定、下の段はサムネイルを挿入する設定で、左から左寄せ、なし、右寄せとなっています。
どれかをクリックすると記事のカーソルを置いた部分に画像タグが挿入されます。
※画像を挿入してもダイアログは表示されず、ウィンドウが閉じないので何度もクリックすると同じ画像が何枚も入ってしまいます。
気をつけてください。

には画像をアップロードした日付と時間が表示されます。
また、「日付・時間 ▼」の文字リンクをクリックすると表示されている画像が一番古いものから20件の表示に切り替わり、文字リンクも「日付・時間 ▲」となります。
もう一度「日付・時間 ▲」の文字リンクをクリックすると最新から20件の表示になり、文字リンクも「日付・時間 ▼」に戻ります。

からはアップロードした画像の削除ができます。
「削除」の文字をクリックすると画像削除のダイアログが表示されます。



画像を削除する場合は「OK」ボタンをクリックすると画像が削除されます。
画像を削除しない場合は「キャンセル」ボタンをクリックするとダイアログが消え画像一覧の挿入画面に戻ります。

画像をアップロードや挿入し終わったら下にスクロールすると「閉じる」の文字リンクがありますのでクリックすると画像一覧の挿入画面のウィンドウが閉じ、記事投稿画面が表示されます。

記事を確認･登録すると画像を挿入した記事が投稿できます。  

ツールパレットの一番左側にあるデザインモードボタンをクリックすると記事投稿時の入力欄をデザインモードに変更することができます。

記事投稿画面が表示されたときはデザインモードボタンはこのようになっており、デザインモードの文字の横の枠にチェックが入っていません。
一度クリックするとボタンがこのようにデザインモードの文字の横の枠にチェックが入り、入力欄の左上に薄いグレイで「DESIGN MODE　デザインモード」と表示されます。



このデザインモード状態で文字を装飾するとそのまま入力欄内に効果が表示されます。

＜デザインモード使用時の注意点＞
デザインモードは入力や設定した文字や画像がどのような感じで表示されるかすぐにわかるので一見便利そうですが、かえって使いにくい場合もあります。

デザインモードで入力･文字装飾･画像挿入を行うと
.一番最初に入力するときは入力欄の一番上の部分を、入力がある場合は入力されている文字のある行の部分をクリックしないと入力欄内にカーソルが表示されない。

1.通常と違い文字の選択が効果をかけると解除されてしまう。

2.文字サイズの変更と他の効果を使うときは先に文字サイズの変更をしないとデザインモードに反映されない。

3.入力の一番最後の文字に文字装飾の効果をかけてしまうと、その後の入力に効果が引き継がれてしまう。

4.文字位置が変更になる文字装飾(引用文にする･左寄せ･中央寄せ･右寄せの各レイアウトボタン)を使った後はその効果が反映されてしまう。

5.画像を挿入すると通常ではカーソルのある位置に画像が挿入されるが、デザインモード時は画像が一番下に挿入されてしまう。

6.文字を選択せずに文字装飾をしてしまったり、重ねてかけることのできない文字装飾(文字サイズの変更以外の効果)を重ねてかけてしまうと、タグが大量に入ってしまうので、通常モードに戻ったときに解りにくい。

以上の事をふまえて、デザインモードを利用する場合は先に文字入力と画像の挿入を行って記事を投稿し、再編集する場合にデザインモードを利用することをおすすめします。