レンダリングのスタイルを追加する

概要

スタイル クラス アイテムを追加し、レンダリングで使用できるようにする方法。

SXA には、レンダリング用に事前設定されたスタイルがあります。ただし、独自のカスタム スタイルを追加したい場合もあります。たとえば、サイト上の一部の画像を余白なしで表示したい場合や、レンダリングに背景色を追加したい場合などです。

コンテンツ エディターでレンダリング用のクラス アイテムを追加するには:

  1. サイトの Presentation フォルダーに移動します。

  2. [Styles] を右クリックして [挿入] をクリックし、[スタイル] をクリックして新しいスタイルを追加します。

  3. 名前を入力して、[OK] をクリックします。

    注記

    新しいスタイルには、他のユーザーがその機能を理解しやすい名前を付けてください。

  4. 新しいスタイルをレンダリングで使用できるようにするには、[スタイル] セクションで [編集] をクリックします。

    663F128991B442FAA9C465D33F9E010F.png
  5. [アイテムを選択] ダイアログで、関連するレンダリングをクリックし、右矢印 6F16BFE47A894D598F5616AD24221271.png をクリックして選択済みアイテムのリストに移動し、[OK] をクリックします。この例では、コンテナとスプリッターのレンダリングで灰色の背景を使用できます。

    44410E213D4A4DDAB89AFED7BD75B033.png
  6. 新しいスタイルを確認するには、エクスペリエンス エディターでスタイル編集アイコンをクリックします。

    F10EE8620F724194860347943BA5CC7B.png
  7. [スタイル] セクションで、新しいスタイルを選択できるようになりました。

    F95416F98A7C4CDF993D238F9FF31BE4.png
  8. [OK] をクリックして新しいスタイルをレンダリングに適用します。