사용 사례

다음 옵션을 사용하여 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를 가져올 수 있습니다

사용 드롭다운을 예 ​(으)로 설정합니다.

구성 저장 ​을 클릭합니다.

필수 구성 요소에서 만든 storefront(으)로 이동합니다.

제품을 찾아 선택합니다. 필요한 사용자 지정을 선택합니다. 장바구니에 추가 ​를 클릭합니다.

{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"}

필수 구성 요소에서 만든 storefront을(를) 엽니다.

상점 빌더를 엽니다. https://da.live/#/<GitHub User Name>/<Repository Name>/main/da/index.md(으)로 이동

인덱스 페이지를 엽니다.

슬라이드 블록 아래에 "Adobe 스토어 데모 시작" 줄을 편집하여 새 제목을 입력합니다.

보내기 아이콘을 클릭하고 미리 보기 ​를 클릭합니다.

미리 보기 페이지를 검토하고 게시 ​를 클릭합니다.

상점 첫 페이지를 새로 고치고 변경 사항이 이제 활성 상태인지 확인하십시오.

Storefront Builder에서 인덱스 페이지를 선택하고 복사 ​를 클릭합니다.

새로 만들기 단추를 클릭하고 폴더 ​를 선택하여 기본 폴더 아래에 실험 폴더를 만듭니다.

experiments 폴더에 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"}

시크릿 또는 비공개 탐색 창을 열고 기본 페이지로 이동합니다.

개인 탐색 창을 닫고 이전 단계를 반복합니다. 페이지를 열 때마다 만든 임의 변형이 표시됩니다.

필수 구성 요소에서 만든 storefront을(를) 열고 변경할 항목으로 이동합니다. 항목 SKU 또는 제품 코드를 확인합니다.

AEM AssetsAdobe Experience Cloud에서 선택하여을(를) 엽니다.

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

Assets을(를) 클릭합니다.

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

SKU 또는 제품 코드 ​로 항목을 검색합니다.

편집할 항목을 선택하고 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"}

유니버설 편집기를 사용하여 상점 사이트를 여십시오.

편집할 텍스트 블록을 선택합니다.

속성 패널에서 변형 생성 ​을 클릭합니다.

생성 단추를 클릭합니다.

생성된 텍스트를 선택하거나 사용자 정의합니다.

상점을 업데이트하려면 게시 ​를 클릭하세요.

변형 생성 열기

영웅 배너 템플릿을 선택하십시오.

사용자 상호 작용 설명 텍스트 상자에 "Adobe 직원 및 파트너가 Adobe 브랜드 장비를 구매할 수 있는 경험!"을 입력하십시오.

도메인 지식을 위한 URL ​에서 www.adobestore.com ​을(를) 입력하십시오.

생성 ​을 클릭합니다.

콘텐츠 변형을 선택하고 이미지 생성 ​을 클릭합니다.

이미지 크기 드롭다운에서 와이드스크린(16:9) ​을 선택합니다.

콘텐츠 형식 드롭다운에서 사진 ​을 선택합니다.

Style 참조 이미지의 경우 기존 Adobe 스토어 배너를 선택하십시오.

사용할 생성된 이미지를 선택하고 저장 ​을 클릭합니다.

다른 참조 이미지와 이 프로세스를 반복하여 더 많은 변형을 생성합니다.