JSONレンダリングとバリアントをページに追加する

Version:

日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

JSONデータモデルには、ページのデザインを容易にするために、3つのレンダリングがあらかじめ定義されています。ページを作成するには、ツールボックスからページにレンダリングをドラッグします。すべてのJSONレンダリングはJSONバリアントに対応しています。

デフォルトでは、次の3つのJSONレンダリングを使用できます。

JSON Content – JSONレンダリングとJSONバリアントを使用してページのフィールドを公開するために使用されます。デフォルトでは、このレンダリングはページ上の2つのフィールドを読み込みます。これらのフィールドは編集できます。
JSON List - 事前定義済クエリまたは構成済クエリによるページのリストを表示します。
JSON Results - 検索クエリの結果を表示します。

JSONへの切り替え

JSONレンダリングの操作を開始する前に、JSONデバイスに切り替える必要があります。

JSONデバイスに切り替えるには:

JSONレンダリングが、右側のパネルのツールボックスで使用できるようになりました。

メモ

タブレットやタッチ対応ノートPCなどのタッチデバイスで作業している場合、デフォルトではツールボックスはタッチモードで開きます。タッチ対応ノートパソコンで作業している場合は、ツールバーの右上にある矢印をクリックしてデスクトップモードに切り替えることができます。

エクスペリエンスエディターでは、ツールボックスからレンダリングをドラッグしてページに追加できます。たとえば、サイトのページを一覧表示する場合は、JSONリストレンダリングを使用します。

JSONレンダリングをページに追加するには:

右側のパネルのツールボックスで、関連するレンダリングを見つけます。レンダリングをクリックしてドラッグを開始すると、レンダリングをドロップできるプレースホルダーが青色に点灯します。クリックして、レンダリングをページにドロップします。たとえば、JSON Listレンダリングをページにドラッグします。

手記

デフォルトでは、JSON Listレンダリングには現在の項目の子が表示されます。たとえば、ホームページから始めてJSONリストレンダリングをページにドラッグすると、サイトのすべてのページが一覧表示されます。これは、デフォルトでSourceTypeフィールドがChildrenに設定されているためです。
リストを表示するには、ページを保存します。

より複雑なリストを作成するには、JSONバリアントを追加します。たとえば、タイトルとコンテンツに加えて、画像と日付のフィールドを追加する場合です。

JSONバリアントを追加するには:

sitecore/コンテンツ/テナント/サイト/プレゼンテーション/レンダリングバリアント/JSONリストに移動し、JSON Listをクリックし、Insertをクリックして、JSON Variant definitionをクリックします。
名前を入力してOKをクリックします。たとえば、タイトルとコンテンツのJSONフィールドを追加するには、JSON ImageとJSON Dateフィールドを追加します。
Variant detailsセクションで、日付形式を選択し、アイテムを保存します。
ImageフィールドのVariant detailsセクションで、画像をGuid、Path、Raw、またはRenderedモードのいずれで表示するかを決定します。

JSONバリアントを選択するには:

エクスペリエンスエディターで、ページ上のJSONレンダリング (JSONリストレンダリングなど) に移動し、Variantフィールドでドロップダウンリストからバリアントをクリックします。
新しいリストを表示するには、ページを保存します。
JSONバリアントを表示するには、リボンのExperienceタブでOtherをクリックし、Previewをクリックします。

この記事を改善するための提案がある場合は、お知らせください!