使用案例

使用下列選項建立您的Cloud Service執行個體：

1. 在​ 環境 ​下拉式清單中選取​ 沙箱。
2. 在​ 測試資料 ​下拉式清單中選取​ Adobe存放區。

登入您的Adobe Experience Cloud帳戶

使用下列選項設定您的Cloud Service店面：

1. 為範本選取adobe-commerce/adobe-demo-store。
2. 選取​ 選取可用的執行個體(Mesh -> SaaS) ​作為連線方法。

在Commerce管理員中，瀏覽至​ 商店 > Settings > 設定 > 付款方法。

在​ 一般組態 ​區段中，輸入您的Payment Services Sandbox ID和Payment Services Sandbox Key。 您可以依照沙箱上線中所述的步驟來取得這些ID

將​ 啟用 ​下拉式清單設定為​ 是。

按一下​ 儲存設定。

前往您在先決條件中建立的店面。

尋找並選取產品。 進行任何必要的自訂選擇。 然後按一下​ 加入購物車。

{width="600" modal="regular"}

選取購物車圖示以檢視您的購物車。

{width="600" modal="regular"}

按一下​ 簽出。

{width="600" modal="regular"}

輸入必要的聯絡詳細資料和送貨資訊。 您可以針對此訂單使用虛構的資訊。

若要結帳，請選取​ 支票/匯票。 若要使用信用卡，請使用Paypal提供的測試卡之一。 您可以將其用於任何未來的到期日和任何CVC。

{width="600" modal="regular"}

{width="600" modal="regular"}

按一下​ 下訂單。

開啟Commerce管理員： <your store URL>/admin。

使用您的Adobe ID登入。

導覽至​ 銷售 > 訂單。

{width="600" modal="regular"}

尋找您所下訂單並確認詳細資料。

{width="600" modal="regular"}

開啟您在先決條件中建立的店面。

開啟店面建置器。 瀏覽至https://da.live/#/<GitHub User Name>/<Repository Name>/main/da/index.md。

開啟​ 索引 ​頁面。

在「輪播」區塊下方，編輯「歡迎使用Adobe商店示範」行以輸入新標題。

按一下傳送圖示並按一下​ 預覽。

檢閱預覽頁面，然後按一下​ 發佈。

重新整理店面頁面，並確認您的變更已上線。

在Storefront Builder中，選取您的索引頁面，然後按一下​ 複製。

按一下​ 新增 ​按鈕並選取​ 資料夾，在主資料夾下建立​ 實驗 ​資料夾。

在​ 實驗 ​資料夾中建立名為​ 1234 ​的資料夾。

將索引頁面的兩個復本貼到​ 1234 ​資料夾中。

開啟每個頁面，並將它們重新命名為「homev1」和「homev2」。 這些是您的挑戰者。

修改每個頁面以包含不同的內容。 例如，變更主圖影像或文字。 您必須能識別每個頁面之間的差異。

發佈您的每個挑戰者頁面。

開啟控制頁，原始索引頁。

新增標題為​ 中繼資料 ​的新區塊。

將下列資訊新增至中繼資料區塊的列

• 標題 — Adobe Commerce

• 說明 — 網站商店

• 實驗 — 1234

• 實驗變體

  • https://<your-site>.aem.live/experiments/1234/indexv1
  • https://<your-site>.aem.live/experiments/1234/indexv2

{width="600" modal="regular"}

開啟無痕瀏覽或私人瀏覽視窗，並導覽至您的首頁面。

關閉私人瀏覽視窗並重複之前的步驟。 每次開啟頁面時，您都會看到已建立的隨機變體。

開啟您在先決條件中建立的店面，並導覽至您要變更的專案。 記下專案SKU或產品代碼。

在AEM AssetsAdobe Experience Cloud中選取，以將其開啟。

{width="600" modal="regular"}

按一下Assets。

{width="600" modal="regular"}

依​ SKU ​或​ 產品代碼 ​搜尋專案。

選取您要編輯的專案，然後按一下​ 在Adobe Express中開啟。

在adobe express中開啟 {width="600" modal="regular"}

在​ 影像 ​面板中，選取​ 插入物件。

{width="600" modal="regular"}

在文字方塊中，說明您要新增的影像。 例如，「雪松樹」。

{width="600" modal="regular"}

調整Brush size並繪製您想要新增產生影像的位置。 在此範例中，請圍繞現有物件繪製以選取背景。

按一下​ 產生 ​以檢視結果。

選取想要的選項，然後按一下​ 保留，從不同的結果中選擇。

按一下​ 您的內容 ​以返回影像編輯器。

按一下​ 儲存 ​以指定影像型別。

再按一下[儲存]儲存變更。​

在​ 儲存資產 ​對話方塊中，選取Commerce 目的地資料夾。

{width="600" modal="regular"}

按一下​ 另存為新資產 ​以儲存影像。

從AEM as a Cloud Service的導覽面板，選取​ Assets > 檔案 > Commerce，然後按一下您在上一節建立的資產。

{width="600" modal="regular"}

按一下​ 屬性。

{width="600" modal="regular"}

選取​ Commerce ​索引標籤。

{width="600" modal="regular"}

確定​ 存在於Adobe Commerce中嗎？ ​欄位已設定為​ 是。

按一下「新增」，然後輸入要新增資產的產品SKU。

{width="600" modal="regular"}

選取資產的位置及資產型別。

選取​ 基本 ​索引標籤並將​ 檢閱狀態 ​索引標籤變更為​ 已核准。

{width="600" modal="regular"}

按一下​ 儲存並關閉。

在Adobe Commerce 管理員 ​中，瀏覽至​ 目錄 > 產品。

選取您在上一節中新增影像的產品。

展開​ 影像和影片 ​區段。

{width="600" modal="regular"}

確認您的影像現在可在影像清單中使用。

返回您的店面，並瀏覽至已修改產品的頁面。

確認新影像是否顯示。

{width="600" modal="regular"}

使用通用編輯器開啟您的店面網站。

選取您要編輯的文字區塊。

在​ 屬性 ​面板中，按一下​ 產生變數。

按一下​ 產生 ​按鈕。

選取或自訂產生的文字。

按一下​ 發佈 ​以更新您的店面。

開啟產生變數

選取​ Hero Banner ​範本。

在​ 說明使用者互動 ​文字方塊中，輸入：「Adobe員工和合作夥伴購買Adobe品牌用具的體驗！」

在網域知識​ 的 URL中，輸入​ www.adobestore.com。

按一下​ 產生。

選取內容變化並按一下​ 產生影像。

從​ 影像大小 ​下拉式清單中，選取​ 寬熒幕(16:9)。

從​ 內容型別 ​下拉式清單中，選取​ 像片。

針對​ 樣式 ​參考影像，選取現有的Adobe商店橫幅。

選取您要使用的產生影像，然後按一下[儲存]。​

對其他參照影像重複此程式以產生更多變化。