リッチコンテンツエディターでテーブルを追加

  • リリースバージョン: Australia
  • 更新日 2026年03月12日
  • 所要時間：6分

    • コンテンツにテーブルを追加して、情報を行と列に整理します。

    始める前に

    必要なロール：sn_cd.content_manager

    [新規コンテンツ] フォームのフィールドに入力します。「リッチコンテンツの作成」を参照してください。

    モジュールまたは列を使用してページレイアウトを作成します。

    手順

    1. [新しいコンテンツ] フォームの [デザイン] タブから [エディターを開く] ボタンを選択して、キャンバスに移動します。
    2. テーブルコンポーネントをキャンバスにドラッグアンドドロップします。
    3. [新テーブルの作成] ウィンドウで、列数と行数を入力します。
    4. 次の場所に移動してテーブルヘッダー行を作成する 設定 > プロパティ をクリックし、[ ヘッダーの有効化 (Enable header)] を選択します。
    5. ヘッダータイトルテキストを書式設定するには、ヘッダー行のテキストボックスをクリックし、次の設定を構成します。
      表 : 1. テーブルヘッダーの設定
      設定フィールド 説明
      スタイリング
      テキストスタイル 事前に書式設定された選択肢を選択することで、テキストの外観をすばやく変更できます。さまざまな見出しまたは段落スタイルを選択できます。

      見出し 1 ～ 6 は h1 ～ h6 の HTML タグに対応しています。
      テキストの色 このドロップダウンを使用して、テキストの色を変更できます。
      選択肢は次のとおりです。
      • プライマリ：ポータルテーマで定義されたプライマリ色。
      • ミュート：ポータルテーマで定義された色。
      • 白：テキストの色を白に変更します。これは、白以外の背景色を使用する場合に便利です。

      テキストの色は、テキストの色に事前定義された CSS クラスをアサインします。
      表示 画像コンポーネントやテキストコンポーネントなど、同じ列内の複数のコンポーネントの外観を構成します。
      注:
      この設定は、タイトルテキストボックスの横に別のコンポーネントを追加する場合にのみ適用されます。
      次のオプションのいずれかを選択します。
      • 並べて表示：(デフォルト) テキストと別のコンポーネントが並べて表示されます。
      • 上と下：(デフォルト)：画像は他のコンポーネントの上に表示されます。
      注:
      最良の結果を得るには、コンポーネントに同じ表示を設定します。たとえば、列に画像とテキストのコンポーネントがあり、画像を左側に表示し、テキストを右側に表示する場合は、両方のコンポーネントの [表示] 設定を [並べて表示] に変更します。
      配置 テキストの水平配置を決定します。以下から選択します。
      • 左揃え (Left justify)
      • 中央揃え (Center justify)
      • 右揃え (Right justify)
      • 両端揃え (Justify) (テキストを両方のマージンに揃える)
      詳細なスタイリング
      パディング パディングは、コンテンツと要素境界との間のスペースです。数値を入力して、上、下、右、または左のパディングの値を指定します。
      マージン マージンは、行と別の要素/キャンバス境界の間のスペースです。数値を入力して、上、下、右、または左のパディングの値を指定します。
      フォント名 文字の表示に使用するフォントを定義します。

      別のフォントを選択するには、ドロップダウン矢印をクリックします。
      フォントサイズ フォントのサイズを設定します。
      フォントの太さ テキストをどのぐらい太くまたは細く表示するかを決定します。

      別の太さを選択するには、ドロップダウン矢印をクリックします。
      行の高さ 2 行のテキスト間の垂直距離を設定します。
      フォントの色 ポータルテーマのフォントの色を上書きします。

      色を選択するには、16 進数コードを入力するか、カラーピッカー (フォント色の右側にある灰色の四角形) をクリックしてカラーパレットから色を選択します。
    セルをクリックして、背景色や境界線など、そのセルの設定を構成します。テーブルの行またはすべてのセルの設定を構成するには、目的のコンテナが選択されるまで上矢印をクリックします。上向き矢印は、現在選択されているコンポーネントのコンテナを選択します
    1. テーブルのスタイリング設定を構成します。
      設定オプションは、セル、行、またはテーブル全体のいずれを選択したかによって異なります。
      表 : 2. スタイリング設定
      設定フィールド 説明
      スタイリング
      背景色 カラーピッカー (チェック柄の正方形) を使用して色を選択するか、表示する背景色を表すカラーコードを入力します。

      すべての HTML カラーがサポートされています。詳細については、「HTML カラー名」を参照してください。
      配置 テキストの水平配置を決定します。以下から選択します。
      • 左揃え (Left justify)
      • 中央揃え (Center justify)
      • 右揃え (Right justify)
      • 両端揃え (Justify) (テキストを両方のマージンに揃える)
      詳細なスタイリング
      幅

      高さ

      		 [幅 (Width)] フィールドと [高さ (Height)] フィールドを使用して、コンポーネントの幅と高さを調整します。
      また、上向き矢印と下向き矢印の左側にある単一の下向き矢印キーを選択して、希望する測定単位を選択できます。以下から選択可能です。
      • 自動：サイズはタブ内のコンテンツに基づきます。タブに追加のテキストを入力すると、幅が自動的に大きくなります。
      • px：測定単位としてピクセルを使用します。
      • %：測定単位としてパーセンテージを使用します。
      パディング パディングは、コンテンツと要素境界との間のスペースです。数値を入力して、上、下、右、または左のパディングの値を指定します。
      マージン マージンは、行と別の要素/キャンバス境界の間のスペースです。数値を入力して、上、下、右、または左のパディングの値を指定します。
      ボーダー ボタンの外側の境界を編集します。
      注:
      境界はボタンの周囲の輪郭です。

      幅：上向き矢印と下向き矢印を使用して、境界線の幅を調整します。幅と高さの場合と同じように、上向き矢印と下向き矢印の左側にある単一の下向き矢印キーを選択して、希望する測定単位を選択できます。

      スタイル：ボタンの周囲の境界線の形式。ドロップダウンを選択して、ボタンの周囲の境界線のタイプを選択します。

      色：ボタンの周囲の境界線の色。背景色の選択と同様に、カラーパレットとスライドバーを使用して、ボタンの色を選択します。
      境界半径 上向き矢印と下向き矢印を使用して、境界線の半径を調整します。幅と高さの場合と同じように、上向き矢印と下向き矢印の左側にある単一の下向き矢印キーを選択して、希望する測定単位を選択できます。
    2. セルを選択した状態で、 設定 > プロパティ 列または行を追加または削除し、セルを結合し、行を上下に移動します。
      セルを選択して列または行を追加するか、セルを結合します
    3. [保存] または、[保存して終了] を選択します。
      [保存] を選択するとコンテンツが保存され、リッチコンテンツエディターのキャンバスに留まります。[保存して終了] を選択すると、レコードが保存され、[新規コンテンツ] フォームに戻ります。

    次のタスク

    • (オプション) コンテンツを翻訳します。

      コンテンツの言語翻訳を要求します。詳細については、「コンテンツライブラリでの多言語サポート」を参照してください。

      注:
      コンテンツの変更が完了した後にのみ、コンテンツを翻訳してください。最良の結果を得るために、翻訳後にコンポーネントを追加または削除したり、書式設定を変更したりすることはお勧めしません。

      異なる言語で異なる書式設定のリッチコンテンツを作成するには、コンテンツを複製し、必要に応じて書式設定を変更します。次に、[対象者] を使用して、言語別にコンテンツの対象をユーザーに絞ります。「対象者」を参照してください。

    • [公開 (Publish)] タブからコンテンツをプレビューします。
      注:
      コンテンツのプレビューは、コンテンツの表示に関する一般的なアイデアを提供するように設計されています。コンテンツの公開後は、デバイスの解像度、テーマの違い、モバイルアプリのスタイル構成の違いにより、見た目が異なる場合があります。
    • 公開計画を構成して、コンテンツの配信先、対象者、利用可能期間を管理します：コンテンツの公開計画の作成