HTML エディターにテーブルを追加する

HTML フィールドコントロールを使用して、テーブルの例をナレッジ記事に追加して書式設定します。

始める前に

必要なロール：admin

このタスクについて

このタスクでは、htmlArea または TinyMCE v6.8.3 でテーブルを作成して書式設定します。作成されるテーブルは、次のいずれかの画像のようになります。

図 : 1. htmlArea のテーブルの例

図 : 2. TinyMCE v6.8.3 のテーブルの例

幅、セル間隔、セルのパディング、境界線、配置などの要素に別の値を入力した場合、結果の表は示されている例とは異なるものになります。

手順

1. 次のように移動する。 All (すべて) > ナレッジ > 編集 をクリックし編集するナレッジ記事を選択します。
2. HTML フィールドで、テーブルを追加する場所にカーソルを置きます。
3. テーブルアイコンをクリックし、[テーブルの挿入] をクリックして、行数と列数を選択します。
4. テーブルのプロパティを編集します。
   1. テーブル内にカーソルを置き、テーブルアイコンを選択して、[テーブルのプロパティ] を選択します。
   2. [全般] タブで次の値を入力します。
      • 幅：75％
      • セル間隔：3
      • セルのパディング：3
      • 境界：1
      • 位置調整：左
   3. [詳細] タブで、[境界色] の横にあるテキストフィールドを選択し、「Gray」と入力します。
      カラーピッカーボックスがグレーに変わり、入力した色が示されます。ボックスを選択して、パレットで色を選択することもできます。
   4. [OK] をクリックします。
5. ヘッダーテーブル行を更新します。
   1. 最初のテーブル行のセルを選択し、テーブルアイコンを選択して、 行 > 行のプロパティ.
   2. [全般] タブで次の値を入力します。
      • 行タイプ：ヘッダー
      • 位置調整：中央
   3. [詳細] タブで、[背景色] の横のテキストボックスに「＃87cefa」と入力して水色に設定します。
   4. [OK] をクリックします。
6. テーブルのセルプロパティを設定します。
   1. ヘッダー行のセルを除いて、最初の列のすべてのテーブルセルを選択します。
   2. テーブルアイコン選択して セル > セルのプロパティ.
   3. [全般] タブで次の値を入力します。
      • H 位置調整 (H Align)：左揃え
      • V 位置調 (V Align)：上
   4. [OK] をクリックします。
   5. 2 列目のテーブルセルに対してこれらの手順を繰り返します。
7. 中央行の背景色を設定します。
   1. 中央のテーブル行にカーソルを置き、テーブルアイコンを選択して、 行 > 行のプロパティ.
   2. [詳細] タブで、[背景色] の横のテキストボックスに「Silver」と入力して色を #c0c0c0 に設定します。
   3. [OK] をクリックします。
   4. 1 つおきのテーブル行に対してこの手順を繰り返します。
8. 列の幅を設定します。
   1. テーブルの最初の列を選択し、テーブルアイコンを選択して、 セル > セルのプロパティ.
   2. [全般] タブで、[幅] テキストフィールドに「30％」と入力します。
   3. [OK] をクリックします。
9. フォームヘッダーを選択して長押し (または右クリック) し、[保存] を選択します。
10. テーブルのセルにデータを入力し、記事を保存します。