--- title: "SXAレンダリングおよびレンダリングバリアント" slug: "the-sxa-renderings-and-rendering-variants" abstract: "SXAには、モジュール化されたコンポーネントベースの設計を保証するための事前定義レンダリングライブラリが付属しています。" --- # SXAレンダリングおよびレンダリングバリアント Sitecore Experience Accelerator(SXA)では、標準的なコンポーネントを必要な場所に直接ドラッグ&ドロップしてページを作成できます。これらのコンポーネントはレンダリングと呼ばれ、エクスペリエンスエディターのツールボックスに一覧表示されます。シンプルなテキスト、画像、動画、ソーシャルメディアプラグインなどのレンダリングも用意されています。 標準のバリアントには、それらをサポートするレンダリングが付属しています。レンダリングバリアントをサポートするレンダリングをページに配置すると、エクスペリエンスボタンツールバーの下にあるドロップダウンからそのバリアントのいずれかを選択できます。バリアントはレンダリングの見た目を変えたり、異なる内容を表示させたりします。例えば、リストレンダリングには詳細リスト、サムネイルリスト、カルーセルなどのバリアントがあります。 デフォルトのレンダリング設定やレンダリングバリアントの作成はコンテンツエディターで可能です。 ## コンポジット **レンダリング** **バリアント** **概要** [アコーディオン](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-accordion-and-tabs.html) 埋め込みレンダリングはバリアントをサポートすることができます 折りたたみパネルを展示しています。 [カルーセル](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-carousel-and-flip.html) 埋め込みレンダリングはバリアントをサポートすることができます 画像、動画、リンク、テキストを含むスライドセットを表示します。 [フリップ](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-carousel-and-flip.html) 埋め込みレンダリングはバリアントをサポートすることができます タイトルとコンテンツレンダリングの両方を持つ2つの面を表示します。 [タブ](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-accordion-and-tabs.html) 埋め込みレンダリングはバリアントをサポートすることができます ページにタブを追加します。 [抜粋](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/configure-a-snippet.html) 埋め込みレンダリングはバリアントをサポートすることができます 再利用可能なレンダリング群を作成するためのプレースホルダーを提供します。 ## 背景 **レンダリング** **概要** 言語選択器 異なる言語バージョン間を切り替えるリンクを提供します。 サイトセレクター 異なるテナントサイト間を切り替えるリンクを提供します。 ## 婚約 **レンダリング** **概要** Facebookコメント Facebookのコメントを表示します。 ディスキュー 最新のコメントを表示します。 ## イベント **レンダリング** **概要** イベントカレンダー イベントリストやGoogleカレンダーからイベントを表示します。 イベント一覧 イベント名、説明、場所、開始・終了時刻、リンクを含むイベント一覧を表示します。 ## 形態 **レンダリング** **概要** WFFMラッパー Webformsのマーケター向けモジュールを使って作成されたフォームを埋め込みます。 Sitecoreフォームラッパー Sitecore Formsモジュールを使って作成されたフォームを埋め込みます。 MVCフォーム フォームモジュールを埋め込んだ後、MVCフォームをページに追加できます。 ## 地図 **レンダリング** **概要** [地図](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/maps.html) GoogleやBingの地図に位置、ルート、エリアを埋め込み、マークできます。このコンポーネントは検索結果ソースに関連付けられたPOI結果も表示できます。地図上のポイントはレンダリングバリアントでフォーマット可能です。 ## メディア **レンダリング** **バリアント** **概要** ファイルリスト はい ダウンロード可能なファイル一覧を表示します。レンダリングバリアントをサポートしています。 フラッシュ いいえ ページ上にSWFオブジェクトを埋め込むこと。 ギャラリー いいえ 画像や動画のギャラリーを展示します。 [画像](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-a--reusable--image.html) はい メディアライブラリから選択した画像をページに追加します。 [画像(再利用可能)](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-a--reusable--image.html) はい メディアライブラリから画像を保存し、再利用を可能にします。 メディアリンク はい メディアライブラリ内のアセットへのリッチリンクを提供します。説明とプレビューが含まれています。レンダリングバリアントをサポートしています。 プレイリスト はい ビデオコンポーネントのプレイリストを作成できます。レンダリングバリアントをサポートしています。 [ビデオ](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-a-video.html) いいえ HTML 5プレーヤー(レガシーブラウザ向けにFlashのフォールバック付き)を表示し、動画を再生します。 ## ナビゲーション **レンダリング** **バリアント** **概要** [アーカイブ](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-an-archive.html) はい ブログのアーカイブをツリー状に表示します。 [パンくず](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-links-and-breadcrumbs.html) いいえ ルートから現在のアイテムまでのすべてのパス項目を一覧にするパンくずを生成します。レンダリングバリアントをサポートしています。 [リンク](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-links-and-breadcrumbs.html) はい リンクを追加します: - 兄弟ページまたは親ページ - 閲覧履歴からのページ - 任意のページまたはリソース [リンクリスト](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-links-and-breadcrumbs.html) はい タイトル、リンク、テキストを含むアイテムリストを表示します。 [ナビゲーション](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-navigation.html) いいえ ナビゲーションメニューを生成します。以下を選択できます: - **メインナビゲーション - ドロップダウン縦方向** – 標準ドロップダウンナビゲーション - **メインナビゲーション - ドロップダウン横方向** – 子項目を1行にまとめたドロップダウンナビゲーション - **サイドバーナビゲーション** – すべての子項目を縦に表示 - **サイトマップナビゲーション** - すべての子項目を縦に表示 - **ビッグ/ファットナビゲーション –** すべての子項目を横に表示します。 - **モバイルナビゲーション** – モバイル向けナビゲーション ## ページ内容 **レンダリング** **バリエーション** **概要** フィールドエディター はい エクスペリエンスエディターで直接コンテンツフィールドを編集できます。 [ページ内容](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-page-list,-pagination,-page-content,-and-title-renderings.html) はい 選択したデータソース項目の特定のフィールドをページ上に表示します。 [ページ一覧](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-page-list,-pagination,-page-content,-and-title-renderings.html) はい あらかじめ定義または構成されたクエリによるページリストを表示します。 [ページ分け](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-page-list,-pagination,-page-content,-and-title-renderings.html) いいえ ページリストのレンダリング用ページ化が追加されました。 [プレーンHTML](https://doc.sitecore.com/xp/en/developers/sxa/93/sitecore-experience-accelerator/en/embed-html-in-sxa.html) いいえ HTMLコードを埋め込むこと。 プレーンHTML(再利用可能) いいえ 再利用を可能にするためにHTMLコードを保存します。 [プロモーション](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-a-promo-rendering.html) はい 別のページのフィールドをレンダリングし、他のレンダリングのプレースホルダーとして機能します。アイコンやタイトル、リンクで構成されています。 [リッチテキスト](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add--reusable--rich-text.html) はい ページ上にフォーマット済みのテキストを追加します。HTMLタグを使ってテキストを書くことができます。 [リッチテキスト(再利用可能)](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add--reusable--rich-text.html) はい リッチテキストを保存し、再利用性を可能にします。 [タイトル](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-page-list,-pagination,-page-content,-and-title-renderings.html) はい 現在のページのタイトルまたは副題を表示します。 ## ページ構造 **レンダリング** **概要** [コンテナ](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/switch-the-context-for-multiple-renderings-in-a-container.html) 他のレンダリング用にラッパーを使って追加のCSSスタイリングを追加します。 ディバイダー プレースホルダーを横に分割します。 編集モードパネル 編集モードでのみ作者に見える他のレンダリングを埋め込むためのプレースホルダーを作成します。 イフラム 外部ページを埋め込みます。 [スプリッター](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/change-the-layout-of-a-page.html) (コラム) プレースホルダーを横に分割します。 [スプリッター](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/change-the-layout-of-a-page.html) (ロウ) プレースホルダーを縦方向に分割します。 トグル ボタンやリンクを表示し、切り替えると追加コンテンツを表示します。 ## Search **レンダリング** **バリエーション** **概要** [集約ファセットフィルター](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-filter-components.html) はい フィルターを1つのコンポーネント内で組み合わせます。 [ファセット概要](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-filter-components.html) いいえ ページ上にアクティブなフィルターを表示し、訪問者はそれらを一つずつまたは一括で削除できます。 [フィルター(チェックリスト)](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-filter-components.html) いいえ 選択された値を基に検索結果を絞り込みます。 [フィルター(日付)](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-filter-components.html) いいえ 選択した日付・時間で検索結果をフィルタリングします。 [フィルター(ドロップダウン)](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-filter-components.html) いいえ 選択されたファセットでタグ付けされたアイテムに基づいて検索結果を絞り込みます。 [フィルター(管理範囲)](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-filter-components.html) いいえ 最小値と最大値で結果を指定します。 [フィルター(半径)](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-filter-components.html) いいえ 現在のユーザーの位置からの距離や位置フィルターレンダリングで提供された位置に基づいて検索結果をフィルタリングします。 [フィルター(レンジスライダー)](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-filter-components.html) いいえ 訪問者が選択した値に対して、ファセットごとに検索結果をフィルタリングします。 [フィルター(スライダー)](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-filter-components.html) いいえ 選択範囲内の特定のファセットに基づいて検索結果をフィルタリングします。 [もっと読み込む](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-components.html) いいえ 検索結果を段階的に読み込みます。 [ロケーションファインダー](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-components.html) いいえ ユーザーの位置を指定します。 [ページセレクター](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-components.html) いいえ 検索結果のページング機能を提供します。このレンダリングはLoad Moreレンダリングとは排他的です。 [ページサイズ](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-components.html) いいえ 訪問者が表示された結果の数を一度だけ切り替えられるようにします。 [結果数](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-components.html) いいえ 訪問者に利用可能な結果の数を示せます。 [結果バリアントセレクター](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-components.html) いいえ 訪問者がSearch Resultsレンダリングで動的に使われるレンダリングバリアントを変更できるようにします [Search Box](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/walkthrough--adding-search-functionality-to-your-page.html) はい 訪問者が提供するテキストに基づいて検索結果を絞り込みます。 \> \[!注\] \> Search Boxコンポーネント内のプレースホルダーはレンダリングや編集できません。なぜなら、そのコンテンツはSXA検索サービスによって生成されているからです。 [Search Results](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/walkthrough--adding-search-functionality-to-your-page.html) はい 検索クエリの結果を表示します。 \> \[!注\] \> Search 結果コンポーネント内でプレースホルダーをレンダリングまたは編集することはできません。なぜなら、そのコンテンツはSXA検索サービスによって生成されているからです。 [ソート結果](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/use-the-sxa-search-components.html) いいえ ユーザーが検索結果のソート条件を切り替えられるようにします。 ## セキュリティ **レンダリング** **概要** ログイン ログインフォームを表示します。 ログアウト ログアウトボタンが表示されます。 ## 社会 **レンダリング** **概要** AddThis(アディス [AddThis](http://www.addthis.com/)のパーソナライズされたウィジェットを統合します。 フィード RSSおよびATOMフィードを表示します。 ソーシャルメディア共有 ソーシャルネットワークリンク(Facebook、Twitter、Google+)を表示 ツイッター Twitterに投稿された最新のツイートを表示します。 ## 分類 **レンダリング** **概要** [タグクラウド](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-taxonomy-to-a-page.html) 検索結果の集約タグを、発生頻度に基づいて視覚的に重み付けして表示します。 [タグリスト](https://doc.sitecore.com/xp/ja/users/sxa/93/sitecore-experience-accelerator/add-taxonomy-to-a-page.html) ページにタグ付けされる分類エントリを表示します。