(4)コレクション・ページの作成
コレクションページを作成する前に予め画像を用意しておきましょう。
「my_home_page」フォルダの下に「collection」というサブ・フォルダを作成して、
そこに予め画像をコピーしておきます。
表の中に画像を入れるので、画像のサイズは 「150×200」程度が手頃です。


<1>表の作成
コレクション・ページは、表の中にキーホルダーの写真を貼り付けて作成します。

コンポーザーを立ち上げ、「開く」アイコンをクリックして「collection.html」を開きましょう。
「目次ページの作成」で作った コレクション とだけ書かれたページが開きます。



挿入(I) - 表(T)をクリックすると、


表の挿入ウィンドウが現れます。
ここで、とりあえず4行 × 5列の表を作成します。
 ・行(R): に「4」
 ・列(C): に「5」
を入力してOKを押します。


4行 × 5列の表が作成されました。


<2>表の中への文字の書き込 み
一番左側の列に分類を、残りの3列に写真を貼り付けます。
左上のセルをクリックして、カーソルを移動させます。

「福島限定」と入力してみましょう。
左上のセルに入力された文字が表示されます。


残りの3列が狭くなりましたが、今は列の幅を自動で調整しているので気にせず続けましょう。


<3>表の中への画像の表示
続いて表の中に画像を貼ってみましょう。
左から2番目のセルにカーソルを移動させ、挿入(I) - 画像(I)をクリックします。


ファイルを選択(F)をクリックして画像を選択します。
画像を選択後、「URLをページの場所に相対的にする」のチェックが入っている事を確認してください。
相対的に画像を指定しないと、プロバイダにデータを転送した時に画像の位置を見失ってしまいます。
この時、「ヒント」にコメントを記載すると、画像の上にカーソルを載せた時にコメントが表示されます。



少し画像が大きすぎたようです。
画像のサイズは初めから ちょうど良い大きさにしておく方が好ましいのですが、
コンポーザーの設定でサイズを変更する事も可能です。


画像の上でマウスの右ボタンを押すと出てくるメニューの中から
「画像のプロパティ」を選択します。


「サイズ」タブをクリックすると寸法関連の情報が表示されます。
初期状態では、実際のサイズで表示されるのですが、
実際の画像サイズは297×219でした。
表に貼り付けるには少し大きすぎます。

ここで、「ユーザー定義のサイズ」をクリックして 幅に「150」と入力し、「OK」します。



サイズが小さくなり、収まりが良くなりました。
同じ要領で画像を貼り付けていきましょう。



<4>列の追加
最初の表のサイズが小さかった為、横方向の列が不足してしまいました。
列を追加してみましょう。



一番右の列にカーソルを置いてから、 表(B) - 挿入(I) - 右に1列(A) をクリックすると
カーソルの有った列の右に列が追加されます。



追 加された列に  画像を貼り付けていきましょう。

<5>行の追加



画像を貼り付けていくと 今度は行が不足してきました。
行を追加してみましょう。



一番下の行にカーソルを移動して、 表(B) - 挿入(I) - 下に1行(B)をクリックすると
行が追加されます。

<6>セルの連結
画像の多いところは、画像が二行にわたる場所が出てしまいました。
ここでは一番左のセルが分類を表すので、2つのセルを連結しましょう。



先ず連結したいセルを選択します。



続いて、表(B) - 選択したセルを連結(J) をクリックします。



セルの連結が行われました。

<7>上下の表示位置の調整
画像は全て貼り付けたものの、文字も画像も上に寄ってしまっています。
これらをセルの中央に揃えてみましょう。



先ず、全てのセルを選択します。
続いて 選択したセル上で右クリックをしてメニューの中から
「表示セルのプロパティ(O)」をクリックします。



表のプロパティのセル・タブにある「コンテンツの配置」の
縦のメニューから「中央」を選択しOKします。



<8>左右の表示位置の調整
同様にして「コンテンツの配置」の横のメニューから「中央」を選択すると
横方向の位置も中央に揃います。


「保存」アイコンを押して、作成したページを保存しましょう。
コレクションのページが完成しました。