部分的なデザインを作成・変更する
このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。
SXAは部分デザインと呼ばれるレンダリングのセットをウェブページ構成に使います。部分的なデザインを使って、ページのデザイン要素を素早く作成し、一貫したスタイルにできます。例えば、ページのヘッダーやフッターなどを一度作成し、それをサイト内のあらゆる場所で使うことができます。
また、特定のページの部分デザインを変更することも可能です。例えば、特定のページのヘッダーが少し違う必要がある場合などです。部分デザインは互いに継承し合うため、基本的な再利用可能な部分デザインのセットからますます複雑なデザインを構築できます。
部分的なデザインを作成する
既存の部分デザインがニーズに合わない場合は、ページ間で再利用するための新しい部分デザインを作成できます。例えば、ページヘッダーの部分デザインなどです。
エクスペリエンスエディターで部分的なデザインを追加するには:
-
リボンのExperience Acceleratorタブで 「部分的なデザイン 」をクリックし、「 新しい部分的なデザインを挿入する」をクリックしてください。
-
「 アイテム挿入 」ダイアログボックスで「 部分デザイン」を選択し、名前を入力して **「OK」**をクリックします。SXAは空のページを読み込みます。ナビゲーションチェックボックスを選択すると、プレゼンテーションレイヤーに入っていることがわかります。
-
今では、ツールボックスからページにレンダリングをドラッグすることで部分的なデザインに追加できます。例えばヘッダーの場合、レイアウト要素を追加し、ヘッダーを左側に4列、右側に8列に分割できます。カラムスプリッターレンダリングをページにドラッグしてレイアウトを分割します。
-
画像レンダリングを使って左4列にロゴを追加します。それを行うには、画像 レンダリングを左の列にドラッグします。
-
「 関連コンテンツ選択 」ダイアログで画像を選択し、OKをクリックします。
!注データノードでデータソースを選択すると、それはページアイテムのサブアイテムとして保存されるローカルデータソースになります。ローカルデータソースに変更を加える場合は、作業中のページにのみ影響します。データソースを再利用し、グローバルに管理したい場合は、ツリー内の別の場所を選択してください。
例えば、ヘッダーにスローガンを追加し、ナビゲーションを追加した後、そのページを保存して部分 的なデザイン メニューで利用できるようにしてください。
基部部分設計を作成する
2つのわずかに異なるヘッダー。冗長な部分デザインを複数作成する必要はありません。部分の継承を活用すれば、例えばナビゲーションコンポーネントを含む1つのベース部分デザインを作成し、その上に他の部分設計を作成し、異なるロゴで違いを埋めるなど、こうすることで、わずかな違いだけの多数のテンプレートを作成するのを避けられます。部分の継承により、共有されたデザインの側面を一か所にまとめ、その変更を作者が作成しているすべてのページタイプに簡単に伝播できます。
部分的な設計を変更する
時には部分的なデザインを変更したい場合もあります。例えば、フッターの住所が変わった場合やヘッダーにスローガンを追加したい場合などで更新が必要になるかもしれません。
!注部分的なデザインを変更すると、その部分的なデザインを使うすべてのページで変更が更新されます。したがって、変更する前にどこで使われているか必ず確認してください。
エクスペリエンスエディターで部分的なデザインを変更するには:
- リボンの Experience Accelerator タブで「 Partial Design」をクリックしてください。
- 変更したい部分的なデザインを選択します。
- 例えばテキストを変更したり、ツールボックスから部分的なデザインにレンダリングを追加したりして変更を加えてください。
- メインリボンで「保存」をクリックします。これで、部分的なデザインは使用ページごとに変更されています。