1. エクスペリエンス エディターでストアフロントを作成する

チュートリアル: メール キャンペーンのストアフロント ランディング ページの作成

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

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

このチュートリアルでは、キャンペーンのランディングページをストアフロントに追加するプロセスについて説明します。ページを作成し、更新をストアフロントに公開した後、特定の商品を宣伝する 自動メールキャンペーン にURLを含めることができます。

このチュートリアルでは、次の方法について説明します。

  • ランディングページを作成する

  • ストアフロントページを作成する

メモ

このチュートリアルに従うには、ネットショップ サイトを作成するときに、Habitatカタログを含める必要があります。

ランディング ページを作成する

この手順では、新しいページを作成し、ストアフロント サイトに追加します。このページは、Email Experience Manager自動メール キャンペーンの一部として送信されたURLを顧客がクリックしたときに表示されるストアフロント商品ページを作成するために使用されます。

ランディング ページを作成するには:

  1. コンテンツ エディタで、sitecore/Content/<tenant>/<site>/Homeに移動します。

  2. Homeアイテムを右クリックし、Insert、Pageの順にクリックします。

  3. Messageダイアログボックスで、ページの名前(fridge-campaignなど)を入力し、「OK」をクリックします。

    ページ名はストアフロントURLで使用されます。たとえば、fridge-campaignは www.storefront.com/fridge-campaignになります。

  4. 新しく作成したページを右クリックし、「 Experience Editor」をクリックします。

  5. リボンのExperience AcceleratorタブのLook & Feelセクションで、Pick Page Designをクリックします。

  6. 表示されるダイアログボックスのPage Designリストで、Default Commerce Pageをクリックし、OKをクリックします。

  7. リボンのSaveをクリックします。

ストアフロントページを作成する

この手順では、エクスペリエンス エディターを使用して、宣伝する冷蔵庫の詳細と画像を含むストアフロント ページを作成します。

ストアフロントページを作成するには:

  1. アプリケーションウィンドウの右側にある矢印をクリックして、Toolboxを開きます。

  2. 「 Commerce Catalog 」セクションから、Catalog Item Containerコンポーネントをページにドラッグします。

  3. Catalog Item Containerツールバーで、「More, Edit Component Properties」を選択します。

  4. General, Data SourceセクションでBrowseをクリックし、Home/Catalogs/Habitat_Master/Departments/Appliances に移動して Habitat Viva 4-Door 22. Cubic Foot Refrigerator with Ice Makerを選択し、OKをクリックします。

  5. 「 OK 」をクリックして、「 Control Properties 」ダイアログ・ボックスを閉じます。

    カタログ アイテム コンテナ レンダリングは、製品アイテムをカタログ レンダリングのグループのデータ ソースとして設定します。コンテナ レンダリング内に追加されたすべてのカタログ レンダリングは、製品コンテキストとして選択した製品を使用します。これにより、レンダリングでは、他の方法では製品コンテキストが利用できないページに製品情報を表示できます。

  6. 「 Page Structure 」セクションから、Splitter (Column) コンポーネントをページにドラッグして、情報を2つの列に整理します。

  7. Commerce Catalogセクションから、Product Imagesコンポーネントをコンテナの左の列にドラッグします。

  8. Commerce Catalogセクションから、次のコンポーネントをコンテナの右列にドラッグします。

    • 製品情報

    • 製品在庫

    • 製品バリエーション

    • 製品価格コンポーネント

    いずれの場合も、関連付けられたコンテンツの選択 ダイアログ ボックスで、既存のコンテンツ (同じ名前) をクリックし、OK をクリックします。

  9. 「 Commerce Cart 」セクションから、Add to Cartコンポーネントをページにドラッグし、変更を保存します。

    エクスペリエンス エディターでは、ランディング ページは次のように表示されます。

    The landing page displayed in the Experience Editor

  10. 「 Home 」タブで「 Publish 」をクリックし、「 Publish Item 」ダイアログボックスで「 Smart Publish」を選択し、「 Publish」をクリックします。「 OK 」をクリックして続行します。

    ライブストアフロントでは、URLを使用してページにアクセスすると、次のようになります。

    The landing page on the live storefront
先端

メール キャンペーンのランディング ページを作成する方法については、Discover Sitecoreチャネルで公開されている ビデオ をご覧ください。

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