表の入れ方、編集の方法

表を入れる方法は、専用部品を使う方法と、文章を入れる部分に[表組み]ボタンを使って入れる方法と2種類あります。

表組部品を使うと、表の色やサイズなどのレイアウトを個別に考えなくても、ある程度体裁の整った表が入るので、デザインに自信がない方におすすめです。

表専用部品を使って入れる方法

ここでは、表専用部品を使って表を入れる方法をご案内します。

1)左パネルで、表を入れたいページをクリックします

2)上パネルで[+部品を追加する]ボタンをクリック

3)表を入れたい場所にある[ここに追加]バーをクリック

4)「おもな要素で選ぶ」をクリック

5)「表組み」をクリック

表の部品一覧が表示されます

部品の種類について

表入りの部品は複数ありますが、単に表だけを入れたい場合は、[簡易版]と付いたものを使います。

6)部品を選択します

部品のプレビューが表示されます

7)[決定]ボタンをクリックします

編集エリアに表が入ります

8)表内を編集します

9)編集中の部品以外をクリック

10)左パネルで編集中のページにある[更新]ボタンをクリック

書式ボタン(表組ボタン)を使って入れる

書式ボタン(リッチテキストエディタボタン)を使って、表組みを入れる手順をご案内します。文章を入れられる場所(文章要素内)に表組を入れられます。

  • ホームページ更新画面で、作業したいページを開いておいてください

1)表組を入れたい場所をクリックし、カーソルを出します

→入力しているエリアの上部にリッチテキストボタンが表示されます

2)[表組み]ボタンをクリック

(ボタン上にマウスを置くと、「表組みを設定します」と表示します)

表組みの設定画面が表示されます

3)「表組の設定」が表示されるので、行数と列数、幅など、必要項目を入力します

項目説明
行数

行数を半角数字で入力します

列数列数を半角数字で入力します
見出し表内に見出し行や列を設ける場合に指定します
枠線の幅表の外枠線の太さを半角数字で入力します。単位はピクセル。
行揃え表の位置(左右の位置)を指定します
表組みのタイトル表の上にタイトルを表示したい場合に入力します
表組の説明目が見えない人向けに、どんな表が配置されているのか、表の概要を入力します。
表の横幅を半角数字で入力します。単位は%(パーセント)
高さ表の高さを半角数字で入力します。単位はピクセル。
マス内余白マス内の余白を調整します。
マスとマスの間隔マスの外枠とマス内の文字列の間隔を半角数字で入力します。単位はピクセル。

4)[OK]ボタンをクリック

カーソルの位置に表が入ります

5)表内に文字を入力します

入力した文字数により各マスの横幅が自動調整されます。
列幅を任意の幅に調整したい場合は、「列幅の調整」を行ってください。

6)編集中の部品以外をクリック

手順は以上です。

  • プレビューで、仕上がりを確認してください。
  • 更新した内容をホームページに反映させるには、左パネルで、更新したページの[更新]ボタンをクリックします。

手順は以上です

上に戻る

1.マスを結合する方法

表のマスは、すぐ右にあるマス、または下にあるマスと結合できます。

行単位、列単位、選択したマス単位での結合はできません。

1)結合したいマスのあたりをクリック

表内にカーソルを表示し、書式ボタンを表示します

2)結合したいマスの中で右クリック

3)「マス」にカーソルを置きます

4)「右のマスと結合」「下のマスと結合」のいずれかをクリック

4)「右のマスと結合」「下のマスと結合」のいずれかをクリック

ご注意ください

複数のマスを一気に結合することはできません

手順は以上です

上に戻る

2.マスを分割する方法

表のマスを分割できます。
一気に複数のマスに分割は、できません。

1)分割したいマスのあたりをクリック

表内にカーソルを表示し、書式ボタンを表示します

2)分割したいマスの中で右クリック

表内にカーソルを表示し、書式ボタンを表示します

3)「マス」にカーソルを置きます

表内にカーソルを表示し、書式ボタンを表示します

4)「マスを左右に分割」「マスを上下に分割」のいずれかをクリック

カーソルのあるマスを分割します。

マスを複数に分割したい場合は、
1度に2つまでしか分割できないため、分割したい数だけ1)と2)を繰り返してください。

 

手順は以上です

上に戻る

3.行を追加する方法

表の行を追加できます。
一気に複数行を追加できません。

1)追加したい行のあたりをクリック

表内にカーソルを表示し、書式ボタンを表示します

2)追加したい行の上、又は下のマス内で右クリック

表内にカーソルを表示し、書式ボタンを表示します

3)「行」にカーソルを置きます

表内にカーソルを表示し、書式ボタンを表示します

4)「行の前に挿入」「行の後に挿入」のいずれかをクリック

カーソルのある行の前(上)、または後(下)に行を追加します

手順は以上です

上に戻る

3.行を追加・削除する方法

表の行を削除できます。
一気に複数行を削除する場合は、削除したい行を選択し、以下を実行します。

1)削除したい行のあたりをクリックし、カーソルを出す

カーソルを置くマスの位置
・行を削除したい場合:削除したい行のマス

2)削除したい行内のマスで右クリック

3)「行」にカーソルを置き、[行を上に挿入/行を下に挿入/行を削除]のいずれかをクリックします

手順は以上です

上に戻る

4.表全体の横幅を調整したい

表の横幅を調整できます。

1)調整したい表内でクリック

2)表内で、右クリック

 

3)「表組みの設定」をクリック

「表組みの設定」を表示します

4)「表の幅」欄に入っている数字を変更します

ご注意ください

表の幅は、「半角数字」と「単位」で入力します。

単位は「%(パーセント)」または「px(ピクセル)」で指定します。

単位を「%(パーセント)」で指定する場合、表の幅をエリア全体の何パーセントにしたいかを、半角数字で入力します。(例えば、ある表をエリア全体の2分の1の幅で表示したい場合は、表の幅を「50%」と半角で入力します。)


単位を「px(ピクセル)」で指定する場合、の幅を何ピクセルにしたいかを、半角数字で入力します。(ピクセルはホームページ上の画像や表などの横幅をあらわす単位です。モニタ上に表示される情報の長さを表します。)

単位を入力しない場合、
px(ピクセル)に自動的に設定されますのでご注意ください。

5)[OK]ボタンをクリック

表の横幅が調整されます

手順は以上です

上に戻る

5.表を透明にしたい

表を透明にすることができます。
選択しているデザインテーマによって、透明にできない場合もあります。

1)調整したい表内でクリック

表内にカーソルを表示し、書式ボタンを表示します

2)表内で、右クリック

3)「表組の設定」をクリック

「表組みの設定」を表示します

4)「枠線の幅」欄を「0(ゼロ)」に変更します

5)[OK]ボタンをクリック

表の枠線がなくなり、透明な表になります

手順は以上です

上に戻る

6.表の配置を変更したい(表を左右の真ん中に表示したい)

表を配置を変更することができます。

1)調整したい表内でクリック

表内にカーソルを表示し、書式ボタンを表示します

2)表内で、右クリック

3)「表組の設定」をクリック

「表組みの設定」を表示します

4)「行揃え」の[▼]ボタンをクリックし、左、中央、右のいずれかを選択します

「表組みの設定」を表示します

5)[OK]ボタンをクリック

表の配置を変更します

手順は以上です

上に戻る

7.表内に色を付けたい、変更したい

マスに色を付けることができます。
複数のマスに一気に色を付けることはできません。

1)調整したい表内でクリック

2)色を付けたいマス内で、右クリック

3)「マス」にカーソルを置きます

4)「マスの設定」をクリック

マスの設定を表示します。

5)[背景色]欄に、色名、または色記号を半角で入力します

色名、色記号とは?

色名とは、色の名前で、アルファベットで表記するものです。色記号とは、各色に割り当てられた番号のことです。
色名例:Black Lime Red
色記号例:#000000 #00FF00 #FF0000
(色記号には、いくつかの種類があります)

 

6)[OK]ボタンをクリック

手順は以上です

上に戻る

8.枠線の色を付けたい、変更したい

マスの枠線に色を付けることができます。
複数のマスに一気に色を付けることはできません。
また表の外枠には色を付けることができません。

1)調整したい表内でクリック

2)色を付けたいマス内で、右クリック

3)「マス」にカーソルを置きます

4)「マスの設定」をクリック

5)[背景色]欄に、色名、または色記号を半角で入力します

色名、色記号とは?

色名とは、色の名前で、アルファベットで表記するものです。色記号とは、各色に割り当てられた番号のことです。
色名例:Black Lime Red
色記号例:#000000 #00FF00 #FF0000
(色記号には、いくつかの種類があります)

 

6)[OK]ボタンをクリック

手順は以上です

上に戻る

9.マスの横幅を調整したい(列幅を調整したい)

マスの横幅を調整することができます。

1)調整したい表内でクリック

2)幅を設定したいマス内で右クリック、[マス]-[マスの設定]をクリック

マスの設定画面が表示されます

3)マスの幅のサイズを入力します

半角数字で指定します

半角数字で指定します

ご注意ください

マスの幅は、半角数字で入力します。
単位は「パーセント」または「ピクセル」を選択します。

単位を「パーセント」で指定する場合、マスの幅を表全体の何パーセントにしたいかを、半角数字で入力します。(例えば、あるマスを表全体の4分の1の幅で表示したい場合は、マスの幅を「25パーセント」に設定します。)

単位を「ピクセル」で指定する場合、マスの幅を何ピクセルにしたいかを、半角数字で入力します。(ピクセルは
ホームページ上の画像や表などの横幅をあらわす単位です。モニタ上に表示される情報の長さを表します。

 

設定項目
項目説明

マスの幅を半角数字で入力します。

高さマスの列数を半角数字で入力します。
マス内での文字列折り返しマス内で文字を折り返したい場合「はい」を指定します。
マス内の横位置マス内の文字の横位置指定をします。左寄せ、中央寄せ等
マス内の縦位置マス内の文字の縦位置指定をします。上寄せ、中央寄せ等
マスの種類通常、使用しません
行の結合数通常、使用しません
列の結合数通常、使用しません
背景色色名、または色記号を半角で入力します
色名例:「黒」Black 「ライム」Lime「赤」 Red
色記号例:「黒」#000000 「ライム」#00FF00 「赤」#FF0000
枠線表の外枠線の太さを半角数字で入力します。

4)[OK]ボタンをクリック

マスの横幅が調整されます。

手順は以上です

上に戻る

10.マス内の文字の配置を調整したい

マスの内の文字の配置(横位置・縦位置)を調整することができます。

1)表内でクリック

2)文字の位置を調整したいマス内で右クリック

3)「マス」にカーソルを置きます

4)「マスの設定」をクリック

「マスの設定」ウィンドウを表示します。

5)[マス内の横位置]欄または[マス内の縦位置]欄で、適切な内容を選択します。
 例)マスの真ん中に文字を配置したい場合は「中央」を選択

手順は以上です

上に戻る