注
Dynamics 365 Commerce の小売インタレストグループは、Yammer から Viva Engage に移行しました。 新しい Viva Engage コミュニティにアクセスできない場合は、このフォーム (https://aka.ms/JoinD365commerceVivaEngageCommunity) に入力して追加し、最新のディスカッションに参加してください。
この記事では、コンテンツ ブロック モジュールと、Microsoft Dynamics 365 Commerce のサイト ページにそれを追加する方法について説明します。
コンテンツ ブロック モジュールを使用して、画像とテキストを組み合わせて製品やプロモーションを販売します。 たとえば、小売業者は、eコマース サイトのホーム ページにコンテンツ ブロック モジュールを追加して、新しい製品を宣伝し、顧客の注目を集めることができます。
コンテンツ ブロック モジュールは、コンテンツ管理システム (CMS) のデータを使用します。 ページでその他の任意のモジュールに依存しないスタンドアロン モジュールです。 小売業者は、製品、販売、機能など、何かを販売または宣伝するサイト ページにコンテンツ ブロック モジュールを追加できます。
eコマースのコンテンツ ブロック モジュールの例
- eコマース サイトのホーム ページにあるコンテンツ ブロック モジュールを使用して、プロモーションや新製品を強調表示します。
- 製品情報を表示するには、製品の詳細ページでコンテンツ ブロック モジュールを使用します。
- カルーセル モジュール内に複数のコンテンツ ブロック モジュールを追加して、複数の製品やプロモーションを強調表示します。
コンテンツ ブロック モジュールとテーマ
コンテンツ ブロック モジュールは、テーマに基づく各種レイアウトおよびスタイルをサポートできます。 たとえば、Fabrikam のテーマは、コンテンツ ブロック モジュールの 3 つのレイアウト (ヒーロー、フィーチャー、およびタイル) をサポートしています。 ヒーロー レイアウトでは、背景上にテキストが重なって画像が表示されます。 フィーチャー レイアウトでは、画像とテキストが並べて表示されます。 タイル レイアウトでは、タイル形式で複数のコンテンツ ブロックを使用できます。
さらに、テーマによって、各レイアウトのさまざまなプロパティを公開することもできます。 テーマ開発者は、コンテンツ ブロック モジュールを使用して、より多くのスタイルでより多くのレイアウトを構築できます。
次の図は、ヒーロー レイアウトを備えたコンテンツ ブロック モジュールの例を示しています。
次の図は、フィーチャー レイアウトを備えたコンテンツ ブロック モジュールの例を示しています。
コンテンツ ブロック モジュール プロパティ
| プロパティ名 | 値 | 内容 |
|---|---|---|
| Image | イメージ ファイル | 画像を使用して、製品やプロモーションを紹介します。 イメージ ギャラリーにイメージをアップロードするか、既存のイメージを使用します。 |
| ヘッダー | ヘッダー テキストとヘッダー タグ (H1、H2、H3、H4、H5、または H6) | 各ヒーロー モジュールにヘッダーを付けることができます。 既定では、H2 ヘッダー タグがヘッダーに使用されます。 ただし、アクセシビリティ要件を満たすようにタグを変更します。 |
| 段落 | 段落のテキスト | ヒーロー モジュールは、リッチ テキスト形式の段落テキストをサポートします。 太字、下線付き、斜体、およびハイパーリンクなど、基本的なリッチ テキスト機能がいくつかサポートされます。 モジュールに適用するページ テーマは、これらの機能の一部をオーバーライドできます。 |
| リンク | リンク テキスト、リンク URL、アクセス可能リッチ インターネット アプリケーション (ARIA) ラベル、および 新しいタブでリンクを開く | ヒーロー モジュールは、1 つ以上の "アクションの呼び出し" リンクをサポートします。 リンクを追加する場合は、リンク テキスト、URL、ARIA ラベルを含めます。 アクセシビリティ要件を満たすために、ARIA ラベルをわかりやすいものにします。 新しいタブで開くリンクを構成します。 |
Fabrikam テーマによって公開されるコンテンツ ブロック モジュールのプロパティ
| プロパティ名 | 値 | 内容 |
|---|---|---|
| テキスト配置 | 左、右、中央 | 画像上のテキストの位置を定義します。 ヒーロー レイアウトにのみ適用されます。 |
| テキストのテーマ | 明るいまたは暗い | 背景イメージに基づいて、テキストの配色を定義します。 たとえば、イメージの背景が暗い場合は、明るいテーマを適用してテキストをより見えるようにし、アクセシビリティのために色のコントラスト比を満たします。 ヒーロー レイアウトにのみ適用されます。 |
| 画像の配置 | 左、右 | 画像をテキストの左または右に配置するかどうかを指定します。 フィーチャー レイアウトにのみ適用されます。 |
コンテンツ ブロック モジュールを新しいページに追加する
ヒーロー モジュールを新しいページに追加し、必要なプロパティを設定するには、次の手順に従います。
- [テンプレート] に移動し、コンテンツ ブロック テンプレートという名前のページ テンプレートを作成します。
- 既定のページのメイン スロットで、ヒーロー モジュールを追加します。
- 保存 を選択し、 編集の完了 を選択してテンプレートをチェックインし、発行 を選択して公開します。
- 先ほど作成したヒーロー テンプレートを使用して、 コンテンツ ブロック ページという名前のページを作成します。
- 既定のページの メイン スロットで、省略記号ボタン (...) を選択してから、モジュールの追加 を選択します。
- モジュールの選択 ダイアログ ボックスで、ヒーロー モジュールを選択して、OK を選択します。
- 左側のアウトライン ツリーで、コンテンツ ブロック モジュールを選択します。
- 右側のプロパティ ウィンドウで、画像の追加を選択します。 次に、既存の画像を選択するか、新しい画像をアップロードします。
- ヘッダーを選択します。
- ヘッダー ダイアログ ボックスで、ヘッダー テキストを追加し、ヘッダー レベルを選択してから、OK を選択します。
- リッチ テキストで、必要に応じてテキストを追加します。
- リンクの追加を選択します。
- リンク ダイアログ ボックスで、リンク テキスト、リンク URL、およびリンクの ARIA ラベルを追加し、OK を選択します。
- ヒーロー レイアウトを選択します。
- 保存 を選択し、 続いてプレビュー を選択してページをプレビューします。
- 編集の完了 を選択してテンプレートをチェックインし、 発行 を選択して公開します。