注
Dynamics 365 Commerce のリテール・インタレスト・グループは、Yammer から Viva Engage に移転しました。 新しい Viva Engage コミュニティにアクセスできない場合は、このフォーム (https://aka.ms/JoinD365commerceVivaEngageCommunity) に入力して追加し、最新のディスカッションに参加してください。
この記事では、タイル リスト モジュールについて説明し、Microsoft Dynamics 365 Commerce のサイト ページに追加する方法について説明します。
タイル リスト モジュールは、カルーセル内ののタイルのコレクションです。 画像やテキストを通じて製品カテゴリや製品ブランドを販売するために使用します。 たとえば、小売業者が eコマース サイトのホーム ページにタイル リスト モジュールを追加して、売れ筋のカテゴリをすべて販売促進することができます。
コンテンツ管理システム (CMS) のデータによって、タイル リスト モジュールが駆動されます。 他のモジュールや Commerce headquarters のデータには依存しません。 小売業者が何かを販売または宣伝するサイト ページ (製品、カテゴリ、ブランドなど) にタイル リスト モジュールを追加します。
次の図は、Adventure Works のホーム ページの中の、タイル リスト モジュールと、タイル モジュールの例を示しています。
重要
タイル リスト モジュールは、Dynamics 365 Commerce バージョン 10.0.20 リリース時点で使用できます。 タイル リスト モジュールは Adventure Works のテーマで示されています。
タイル リスト モジュールとテーマ
タイル リスト モジュールは、テーマに基づく各種レイアウトおよびスタイルをサポートできます。 たとえば、Adventure Works のテーマでは、サイト ユーザーがタイルの上にカーソルを置くと、タイルはアニメーション効果を表示します。 各テーマには、タイル リストとタイル モジュールのプロパティを追加できます。 テーマ開発者は、タイル リストとタイル モジュール用の追加のレイアウトを構築することもできます。
タイル リスト モジュールのプロパティ
| プロパティ名 | 値 | 内容 |
|---|---|---|
| ヘッダー | ヘッダー テキストとヘッダー タグ | タイル リスト モジュールのテキスト ヘッダーです。 |
タイル モジュール プロパティ
| プロパティ名 | 値 | 内容 |
|---|---|---|
| Image | イメージ ファイル | 画像を使用して、製品またはカテゴリを紹介します。 Commerce サイト ビルダーのメディア ライブラリに画像をアップロードすることも、既存のイメージを使用することもできます。 |
| ヘッダー | ヘッダー テキストとヘッダー タグ (H1、H2、H3、H4、H5、または H6) | 既定では、見出しには H2 見出しタグが使用されますが、アクセシビリティ要件を満たすようにタグを変更できます。 |
| 段落 | 段落のテキスト | モジュールは、リッチ テキスト形式の段落テキストをサポートします。 ハイパーリンク、太字、下線、斜体のテキストなど、いくつかの基本的なリッチ テキスト機能がサポートされています。 これらの機能の一部は、モジュールに適用するページ テーマによってオーバーライドできます。 |
| リンク | リンク テキスト、リンク URL、アクセス可能リッチ インターネット アプリケーション (ARIA) ラベル、および 新しいタブでリンクを開く | モジュールは、1 つ以上の "アクションの呼び出し" リンクをサポートします。 リンクを追加する場合は、リンク テキスト、URL、ARIA ラベルが必要です。 アクセシビリティ要件を満たすために、ARIA ラベルをわかりやすいものにします。 リンクを新しいタブで開くよう構成できます。 |
| タイル リンク | リンク テキスト、リンク URL、ARIA ラベル、および新しいタブでリンクを開くセレクター | このプロパティを使用して、"行動喚起" リンクを定義します。 リンクを追加する場合は、リンク テキスト、URL、ARIA ラベルが必要です。 アクセシビリティ要件を満たすために、ARIA ラベルをわかりやすいものにします。 リンクを新しいタブで開くよう構成できます。 |
| アイコン | Image | 製品またはカテゴリの画像に加えて、アイコン 記号を追加します。 アイコン シンボルの画像は、製品またはカテゴリの画像の上に表示されます。 |
タイル リンク モジュールを新しいページに追加する
タイル リスト モジュールを新しいページに追加し、Commerce サイト ビルダーで必要なプロパティを設定するには、次の手順に従います。
- テンプレートに移動し、サイトのホーム ページのマーケティング テンプレートを開きます (または、新しいマーケティング テンプレートを作成します)。
- 既定のページの メイン スロットで、省略記号 (...) を選択し、モジュールの追加 を選択します。
- モジュールの選択 ダイアログ ボックスで タイトル リスト モジュールを選択し、OK を選択します。
- 保存 を選択し、 編集の完了 を選択してテンプレートをチェックインし、発行 を選択して公開します。
- ページに移動し、サイトのホーム ページを開きます (または、マーケティング テンプレートを使用して新しいホーム ページを作成します)。
- 既定のページの メイン スロットで、省略記号ボタン (...) を選択してから、モジュールの追加 を選択します。
- モジュールの選択 ダイアログ ボックスで タイトル リスト モジュールを選択し、OK を選択します。
- タイル リスト モジュールのプロパティ ウィンドウで、ヘッダーを追加します。
- タイル リスト スロットで、省略ボタン (...) を選択して モジュールの追加 を選択します。
- モジュールの選択 ダイアログ ボックスで タイトル モジュール モジュールを選択し、OK を選択します。
- タイル モジュールのプロパティ ウィンドウで、画像、ヘッダー、およびアイコン記号画像を追加します。
- 必要に応じて、タイル モジュールをさらに追加して構成します。
- 保存 を選択し、 続いてプレビュー を選択してページをプレビューします。
- 編集の完了 を選択してテンプレートをチェックインし、 発行 を選択して公開します。