リッチコンテンツエディターでの列の追加

  • リリースバージョン: Washingtondc
  • 更新日 2024年02月01日
  • 読む2読むのに数分

    • リッチコンテンツエディターのキャンバスを使用して、ページのレイアウトの定義と整理に役立つ列を作成します。

    始める前に

    必要なロール：sn_cd.content_manager

    [新規コンテンツ] フォームを完了し (「リッチコンテンツの作成」を参照)、リッチコンテンツキャンバスに移動すると、リッチコンテンツを作成できます。

    1、2、または 3 つの列を追加できます。それぞれの列は、他のコンポーネントのコンテナとして機能します。各列コンポーネントは、コンポーネントを選択し、 設定でプロパティを更新することによって編集することもできます。
    注:
    列内のセルの最小高さは 75px です。セルの高さを小さくすると、セルが行からはみ出します。

    手順

    1. [新しいコンテンツ] フォームの [デザイン] タブから [エディターを開く] ボタンを選択して、キャンバスに移動します。
    2. リッチコンテンツエディターのキャンバスから、ドラッグアンドドロップ方式で列を追加できます。
      列は、作成するコンテンツのコンテナとして機能します。

      リッチコンテンツエディター - キャンバスと列

      1 列、 2 列、または 3 列 をリッチコンテンツエディターのキャンバスにドロップすると、2 つのセパレーターが表示されます。外側のセパレーターには [行] のラベルが付いています。内側のセパレーターには [セル] のラベルが付いています。

    行またはセルに背景色、最大幅、パディングなどのスタイリングを追加します。スタイリングを追加しない場合は、このページの下部にあるリンクに進むことができます。
    1. 編集する行またはセルを選択します。
    2. [設定] タブに移動します。
    3. 次のいずれかのスタイル設定を使用します。
      設定フィールド 説明
      スタイリング
      背景色 カラーピッカー (灰色の正方形) を使用して色を選択するか、表示する背景色を表すカラーコードを入力します。

      すべての HTML カラーがサポートされています。詳細については、「HTML カラー名」を参照してください。
      詳細なスタイリング
      幅 数値を入力するか、セルの右側をドラッグして、値を指定します。
      測定単位を選択します。
      • px：ピクセル
      • %：パーセンテージ
      高さ 数値を入力するか、行の下部をドラッグして、値を指定します。
      測定単位を選択します。
      • px：ピクセル
      • %：パーセンテージ
      パディング パディングは、コンテンツと要素境界との間のスペースです。数値を入力して、上、下、右、または左のパディングの値を指定します。
      マージン (行のみ) マージンは、行と別の要素/キャンバス境界の間のスペースです。数値を入力して、上、下、右、または左のパディングの値を指定します。
      境界線 (セルのみ) 幅、境界線のスタイル、および色を定義します。
      境界線の半径 (セルのみ) 半径を設定すると、境界線の角が丸くなります。
      プロパティ
      ID HTML 要素を識別する一意の ID。
      タイトル ユーザーがコンポーネントにカーソルを合わせると表示されるツールヒントまたは情報。
    4. [保存] を選択します。

    次のタスク

    列をさらに追加してスタイルを設定し、ページ上のすべてのコンテンツのレイアウトを作成します。

    次に、画像、ビデオ、テキストボックス、ボタンなどのコンポーネントを追加します。