세일즈포스 상거래 클라우드 사용자 가이드

이 문서는 브라이트코브 Salesforce Commerce Cloud 커스텀 카트리지를 사용하여 비디오 파일을 브라이트코브 클라우드/서버에 업로드하고 필요에 따라 이러한 파일을 스토어프론트 (제품 세부 정보 페이지, 카테고리 랜딩 페이지, 제품 목록 페이지 등) 에 게시하기 위한 단계별 지침을 제공합니다.

다중 언어 지원

확장은 비즈니스 관리자 인터페이스에 대한 여러 UI 언어 지원을 제공합니다.

조직 프로파일
조직 프로파일
비즈니스 관리자 - 영어
비즈니스 관리자 - 영어
비즈니스 매니저 - 프랑스어
비즈니스 매니저 - 프랑스어

비디오 추가

다음은 비디오를 추가하는 단계입니다.

  1. 판매자 도구 - > 브라이트코브 - 비디오 > 추가
  2. 메뉴에서언어를선택합니다. 기본값은 사이트에 대해 선택된 기본 로케일입니다.
    비디오 언어 선택기
    비디오 언어 선택기
  3. 비디오 필드 옆에 있는선택옵션을 클릭합니다.
  4. 나타나는 대화 상자에서 비디오 파일을 선택하십시오.
    비디오 선택 대화 상자
    비디오 선택 대화 상자
  5. 썸네일 필드 옆에 있는선택옵션을 클릭하면 썸네일 파일을 선택할 수 있는 유사한 팝업 대화상자가 나타납니다.
  6. 포스터 필드 옆에 있는선택옵션을 클릭하면 포스터 파일을 선택할 수 있는 유사한 팝업 대화 상자가 나타납니다.
  7. 양식을 제출하여 수집 프로세스를 시작합니다.
    비디오 인제스트 양식 제출
    비디오 인제스트 양식 제출
  8. 제출 후 양식에 성공 메시지의 유효성을 검사합니다:
    비디오 인제스트 성공 검증
    비디오 인제스트 성공 검증
  9. 브라이트코브 스튜디오에 로그인하고 Media 모듈로 이동하여 비디오가 성공적으로 수집되었는지 확인할 수 있습니다.
    스튜디오에서 비디오 보기
    스튜디오에서 비디오 보기
  10. 로케일 코드를 확인하기 위해 비디오를 클릭하여 세부 정보를 확인할 수도 있습니다.
    로케일 코드 확인
    로케일 코드 확인

비디오 할당 - 범주

먼저 카테고리에 비디오를 할당하는 단계를 살펴 보겠습니다.

카테고리에 비디오 할당

  1. 판매자 도구 - > 브라이트코브 - 비디오 > 할당 (카테고리)으로 이동합니다.
  2. 비디오는 로케일에 할당됩니다.
    • 로케일 관련 데이터는 드롭 다운에서 로케일을 변경하여 볼 수 있습니다:
      로케일 메뉴 - 영어
      로케일 메뉴 - 영어
      로케일 메뉴 - 프랑스어
      로케일 메뉴 - 프랑스어
    • 비디오 썸네일은 비디오 ID에 커서를 올려 놓으면 볼 수 있습니다.
      비디오 축소판 보기
      비디오 축소판 보기
  3. 비디오 할당옵션을 클릭하여 하나 이상의 비디오를 할당합니다.
  4. 이미 할당된 비디오가 할당된 비디오 그리드에서 선택한 대로 표시됩니다.
    할당된 비디오
    할당된 비디오
  5. 할당된 슬롯은 같은 로케일의 다른 비디오에 사용할 수 없습니다.
    할당된 비디오 슬롯
    할당된 비디오 슬롯
  6. 플레이어와 슬롯은 각 비디오 타일에서 사용할 수 있는 드롭다운을 사용하여 변경할 수 있습니다.
  7. 슬롯이 다른 다른 비디오를 선택합니다.
  8. 선택한 비디오를 할당하려면 [비디오 저장] 버튼을 클릭합니다.
    비디오 할당 저장
    비디오 할당 저장
  9. 할당된 비디오 및 슬롯을 확인합니다.
    비디오 할당 확인
    비디오 할당 확인
  10. 카테고리 객체의 데이터를 확인합니다.
  11. 판매자 도구 - > 카탈로그로이동합니다.
  12. 카탈로그를 선택합니다.
  13. 범주/하위 범주를 선택합니다.
  14. 편집을선택합니다.
  15. 범주 속성을선택합니다.
  16. 브라이트코브 섹션까지 아래로 스크롤합니다.
    브라이트코브 카테고리 속성
    브라이트코브 카테고리 속성
  17. 하위 범주에 비디오를 할당하려면 범주를 클릭하십시오.
    카테고리 선택
    카테고리 선택
  18. 하위 범주 목록이 나타납니다.
    하위카테고리 리스트
    하위카테고리 리스트
  19. 3-16단계를 수행하여 하위 범주에 비디오를 할당합니다.

마스터 제품에 비디오 할당

  1. 판매자 도구 - > 브라이트코브 - 비디오 > 할당 (제품)으로 이동합니다.
  2. 비디오는 로케일에 할당됩니다.
    • 로케일 관련 데이터는 드롭 다운에서 로케일을 변경하여 볼 수 있습니다:
      로케일 메뉴 - 영어
      로케일 메뉴 - 영어
      로케일 메뉴 - 프랑스어
      로케일 메뉴 - 프랑스어
    • 비디오 썸네일은 비디오 ID에 커서를 올려 놓으면 볼 수 있습니다.
      비디오 축소판 보기
      비디오 축소판 보기
  3. 비디오 할당옵션을 클릭하여 하나 이상의 비디오를 할당합니다.
  4. 이미 할당된 비디오가 할당된 비디오 그리드에서 선택한 대로 표시됩니다.
    할당된 비디오
    할당된 비디오
  5. 할당된 슬롯은 같은 로케일의 다른 비디오에 사용할 수 없습니다.
    할당된 비디오 슬롯
    할당된 비디오 슬롯
  6. 플레이어와 슬롯은 각 비디오 타일에서 사용할 수 있는 드롭다운을 사용하여 변경할 수 있습니다.
  7. 슬롯이 다른 다른 비디오를 선택합니다.
  8. 선택한 비디오를 할당하려면 [비디오 저장] 버튼을 클릭합니다.
    비디오 할당 저장
    비디오 할당 저장
  9. 할당된 비디오 및 슬롯을 확인합니다.
    비디오 할당 확인
    비디오 할당 확인
  10. 카테고리 객체의 데이터를 확인합니다.
  11. 판매자 도구 - > 제품으로이동합니다.
  12. 제품 ID를검색합니다.
  13. 제품을 선택합니다.
  14. 일반을선택합니다.
  15. 브라이트코브 섹션까지 아래로 스크롤합니다.
    제품 세부 정보 브라이트코브 섹션
    제품 세부 정보 브라이트코브 섹션

변형 상품에 비디오 할당

  1. 판매자 도구 - > 브라이트코브 - 비디오 > 할당 (제품)으로 이동합니다.
  2. 제품 ID를클릭합니다.
  3. 선택한 마스터의 변형 목록이 나타납니다.
    제품 변형 목록
    제품 변형 목록
  4. 비디오는 로케일에 할당됩니다.
    • 로케일 관련 데이터는 드롭 다운에서 로케일을 변경하여 볼 수 있습니다:
      로케일 메뉴 - 영어
      로케일 메뉴 - 영어
      로케일 메뉴 - 프랑스어
      로케일 메뉴 - 프랑스어
    • 비디오 썸네일은 비디오 ID에 커서를 올려 놓으면 볼 수 있습니다.
      비디오 축소판 보기
      비디오 축소판 보기
  5. 비디오 할당옵션을 클릭하여 하나 이상의 비디오를 할당합니다.
  6. 이미 할당된 비디오가 할당된 비디오 그리드에서 선택한 대로 표시됩니다.
    할당된 비디오
    할당된 비디오
  7. 할당된 슬롯은 같은 로케일의 다른 비디오에 사용할 수 없습니다.
    할당된 비디오 슬롯
    할당된 비디오 슬롯
  8. 플레이어와 슬롯은 각 비디오 타일에서 사용할 수 있는 드롭다운을 사용하여 변경할 수 있습니다.
  9. 슬롯이 다른 다른 비디오를 선택합니다.
  10. 선택한 비디오를 할당하려면 [비디오 저장] 버튼을 클릭합니다.
    비디오 할당 저장
    비디오 할당 저장
  11. 할당된 비디오 및 슬롯을 확인합니다.
    비디오 할당 확인
    비디오 할당 확인
  12. 카테고리 객체의 데이터를 확인합니다.
  13. 판매자 도구 - > 제품으로이동합니다.
  14. 제품 ID를검색합니다.
  15. 제품을 선택합니다.
  16. 일반을선택합니다.
  17. 브라이트코브 섹션까지 아래로 스크롤합니다.
    제품 세부 정보 브라이트코브 섹션
    제품 세부 정보 브라이트코브 섹션
  18. 우리는 사이트의 카탈로그에 할당 된 모든변형의목록을 얻을 수 있습니다.
  19. 판매자 도구 - > 브라이트코브 - 비디오 > 할당 (제품)으로 이동합니다.
  20. 변형 제품선택
    변형 제품
    변형 제품
  21. 5에서 17까지의 단계를 따릅니다.

표준 상품에 비디오 할당

  1. 판매자 도구 - > 브라이트코브 - 비디오 > 할당 (표준 제품)으로 이동합니다.
  2. 비디오는 로케일에 할당됩니다.
    • 로케일 관련 데이터는 드롭 다운에서 로케일을 변경하여 볼 수 있습니다:
      로케일 메뉴 - 영어
      로케일 메뉴 - 영어
      로케일 메뉴 - 프랑스어
      로케일 메뉴 - 프랑스어
    • 비디오 썸네일은 비디오 ID에 커서를 올려 놓으면 볼 수 있습니다.
      비디오 축소판 보기
      비디오 축소판 보기
  3. 비디오 할당옵션을 클릭하여 하나 이상의 비디오를 할당합니다.
  4. 이미 할당된 비디오가 할당된 비디오 그리드에서 선택한 대로 표시됩니다.
    할당된 비디오
    할당된 비디오
  5. 할당된 슬롯은 같은 로케일의 다른 비디오에 사용할 수 없습니다.
    할당된 비디오 슬롯
    할당된 비디오 슬롯
  6. 플레이어와 슬롯은 각 비디오 타일에서 사용할 수 있는 드롭다운을 사용하여 변경할 수 있습니다.
  7. 슬롯이 다른 다른 비디오를 선택합니다.
  8. 비디오 저장 버튼을 클릭하여 선택한 비디오를 할당합니다.
    비디오 할당 저장
    비디오 할당 저장
  9. 할당된 비디오 및 슬롯을 확인합니다.
    비디오 할당 확인
    비디오 할당 확인
  10. 제품 객체의 데이터를 확인합니다.
  11. 판매자 도구 - > 제품으로이동합니다.
  12. 제품 ID를검색합니다.
  13. 제품을 선택합니다.
  14. 일반을선택합니다.
  15. 브라이트코브 섹션까지 아래로 스크롤합니다.
    제품 세부 정보 브라이트코브 섹션
    제품 세부 정보 브라이트코브 섹션

선택사항 그룹에 비디오 할당

  1. 판매자 도구 - > 브라이트코브 - 비디오 > 할당 (선택사항 그룹)으로 이동합니다.
  2. 비디오는 로케일에 할당됩니다.
    • 로케일 관련 데이터는 드롭 다운에서 로케일을 변경하여 볼 수 있습니다:
      로케일 메뉴 - 영어
      로케일 메뉴 - 영어
      로케일 메뉴 - 프랑스어
      로케일 메뉴 - 프랑스어
    • 비디오 썸네일은 비디오 ID에 커서를 올려 놓으면 볼 수 있습니다.
      비디오 축소판 보기
      비디오 축소판 보기
  3. 비디오 할당옵션을 클릭하여 하나 이상의 비디오를 할당합니다.
  4. 이미 할당된 비디오가 할당된 비디오 그리드에서 선택한 대로 표시됩니다.
    할당된 비디오
    할당된 비디오
  5. 할당된 슬롯은 같은 로케일의 다른 비디오에 사용할 수 없습니다.
    할당된 비디오 슬롯
    할당된 비디오 슬롯
  6. 플레이어와 슬롯은 각 비디오 타일에서 사용할 수 있는 드롭다운을 사용하여 변경할 수 있습니다.
  7. 슬롯이 다른 다른 비디오를 선택합니다.
  8. 비디오 저장 버튼을 클릭하여 선택한 비디오를 할당합니다.
    비디오 할당 저장
    비디오 할당 저장
  9. 할당된 비디오 및 슬롯을 확인합니다.
    비디오 할당 확인
    비디오 할당 확인
  10. 제품 객체의 데이터를 확인합니다.
  11. 판매자 도구 - > 제품으로이동합니다.
  12. 제품 ID를검색합니다.
  13. 제품을 선택합니다.
  14. 일반을선택합니다.
  15. 브라이트코브 섹션까지 아래로 스크롤합니다.
    제품 세부 정보 브라이트코브 섹션
    제품 세부 정보 브라이트코브 섹션
  16. 선택사항 그룹의 지정된 변형으로 이동할 수 있습니다.
  17. 선택사항 그룹 ID를 선택합니다.
    선택사항 그룹 비디오
    선택사항 그룹 비디오
  18. 선택한 선택사항 그룹에 대한 변형 목록이 나타납니다.
    변종 목록
    변종 목록

상품 세트에 비디오 지정

  1. 판매자 도구 - > 브라이트코브 - 비디오 > 할당 (제품 세트)으로 이동합니다.
  2. 비디오는 로케일에 할당됩니다.
    • 로케일 관련 데이터는 드롭 다운에서 로케일을 변경하여 볼 수 있습니다:
      로케일 메뉴 - 영어
      로케일 메뉴 - 영어
      로케일 메뉴 - 프랑스어
      로케일 메뉴 - 프랑스어
    • 비디오 썸네일은 비디오 ID에 커서를 올려 놓으면 볼 수 있습니다.
      비디오 축소판 보기
      비디오 축소판 보기
  3. 비디오 할당옵션을 클릭하여 하나 이상의 비디오를 할당합니다.
  4. 이미 할당된 비디오가 할당된 비디오 그리드에서 선택한 대로 표시됩니다.
    할당된 비디오
    할당된 비디오
  5. 할당된 슬롯은 같은 로케일의 다른 비디오에 사용할 수 없습니다.
    할당된 비디오 슬롯
    할당된 비디오 슬롯
  6. 플레이어와 슬롯은 각 비디오 타일에서 사용할 수 있는 드롭다운을 사용하여 변경할 수 있습니다.
  7. 슬롯이 다른 다른 비디오를 선택합니다.
  8. 비디오 저장 버튼을 클릭하여 선택한 비디오를 할당합니다.
    비디오 할당 저장
    비디오 할당 저장
  9. 할당된 비디오 및 슬롯을 확인합니다.
    비디오 할당 확인
    비디오 할당 확인
  10. 제품 객체의 데이터를 확인합니다.
  11. 판매자 도구 - > 제품으로이동합니다.
  12. 제품 ID를검색합니다.
  13. 제품을 선택합니다.
  14. 일반을선택합니다.
  15. 브라이트코브 섹션까지 아래로 스크롤합니다.
    제품 세부 정보 브라이트코브 섹션
    제품 세부 정보 브라이트코브 섹션
  16. 우리는 제품 세트의 할당 된 제품으로 이동할 수 있습니다.
  17. 제품 세트 ID를 선택합니다.
    제품 세트 비디오
    제품 세트 비디오
  18. 선택한 제품 세트에 대한 제품 목록이 나타납니다.
    제품 목록
    제품 목록

상품 번들에 비디오 할당

  1. 판매자 도구 - > 브라이트코브 - 비디오 > 할당 (제품 번들)으로 이동합니다.
  2. 비디오는 로케일에 할당됩니다.
    • 로케일 관련 데이터는 드롭 다운에서 로케일을 변경하여 볼 수 있습니다:
      로케일 메뉴 - 영어
      로케일 메뉴 - 영어
      로케일 메뉴 - 프랑스어
      로케일 메뉴 - 프랑스어
    • 비디오 썸네일은 비디오 ID에 커서를 올려 놓으면 볼 수 있습니다.
      비디오 축소판 보기
      비디오 축소판 보기
  3. 비디오 할당옵션을 클릭하여 하나 이상의 비디오를 할당합니다.
  4. 이미 할당된 비디오가 할당된 비디오 그리드에서 선택한 대로 표시됩니다.
    할당된 비디오
    할당된 비디오
  5. 할당된 슬롯은 같은 로케일의 다른 비디오에 사용할 수 없습니다.
    할당된 비디오 슬롯
    할당된 비디오 슬롯
  6. 플레이어와 슬롯은 각 비디오 타일에서 사용할 수 있는 드롭다운을 사용하여 변경할 수 있습니다.
  7. 슬롯이 다른 다른 비디오를 선택합니다.
  8. 비디오 저장 버튼을 클릭하여 선택한 비디오를 할당합니다.
    비디오 할당 저장
    비디오 할당 저장
  9. 할당된 비디오 및 슬롯을 확인합니다.
    비디오 할당 확인
    비디오 할당 확인
  10. 제품 객체의 데이터를 확인합니다.
  11. 판매자 도구 - > 제품으로이동합니다.
  12. 제품 ID를검색합니다.
  13. 제품을 선택합니다.
  14. 일반을선택합니다.
  15. 브라이트코브 섹션까지 아래로 스크롤합니다.
    제품 세부 정보 브라이트코브 섹션
    제품 세부 정보 브라이트코브 섹션
  16. 우리는 제품 번들의 할당 된 제품으로 이동할 수 있습니다.
  17. 제품 번들 ID를 선택합니다.
    제품 세트 비디오
    제품 번들 비디오
  18. 선택한 제품 번들의 제품 목록이 나타납니다.
    제품 목록
    제품 목록

비디오 임베드

비디오 임베딩 단계를 통해 ISML 페이지에서 비디오를 렌더링하는 코드를 얻을 수 있습니다.

  1. 판매자 도구 - > 브라이트코브 - 비디오 > 삽입으로이동합니다.
  2. 원하는 비디오 및 플레이어를 선택하고코드 가져오기를클릭합니다.
    비디오 임베드
    비디오 임베드
  3. 코드와 함께 팝업 대화 상자가 나타납니다. 코드 블록을 선택하면 클립 보드에 복사됩니다.
    임베드 코드
    임베드 코드
  4. 코드를 콘텐츠 자산, 콘텐츠 슬롯 또는 ISML 템플릿에 붙여넣어 비디오를 렌더링합니다.

대량 업로드

대량 업로드는.csv 파일을 업로드하여 대량 수량으로 비디오를 수집 할 수 있습니다. 이 작업은.csv 파일을 처리하고 비디오를 브라이트코브 계정으로 인제스트합니다. 샘플 벌크업로드 파일은 메타 디렉토리 아래의 zip 파일에 첨부됩니다.

  1. 판매자 도구 - > 브라이트코브 - > 대량 업로드로이동합니다.
  2. .csv 파일을 선택합니다.
  3. 제출을 클릭합니다.
    대량 업로드
    대량 업로드
  4. 파일이 업로드됩니다. 온도아래 디렉토리 bulkUpload폴더.
    대량 업로드 폴더
    대량 업로드 폴더
  5. 파일 데이터:
    파일 데이터
    파일 데이터
  6. 관리 - > 작업으로이동합니다.
  7. 대량 업로드작업을 선택하고실행을누릅니다.
  8. 작업 완료 상태를 확인합니다.
    대량 업로드 완료 확인
    대량 업로드 완료 확인
  9. 브라이트코브 계정에서 비디오 객체를 확인합니다.
    브라이트코브의 비디오 객체 확인
    브라이트코브의 비디오 객체 확인
  10. 처리 된 파일대량 업로드작업이 이동됩니다 bulkUpload_processed아래 폴더온도예배 규칙서.
    처리된 대량 업로드 파일
    처리된 대량 업로드 파일

대량 할당

대량 할당은.csv 파일을 업로드하여 대량 수량의 카테고리, 하위 카테고리 및 제품에 비디오를 할당 할 수 있습니다. 대량 할당은.csv 파일을 업로드하여 대량 수량의 카테고리, 하위 카테고리 및 제품에 비디오를 할당 할 수 있습니다. 범주 및 제품에 대한 샘플 BulkAssign 파일은메타디렉토리 아래의 zip 파일에 첨부되어 있습니다.

이 작업은 동일한 실행 중에 카테고리 및 제품에 대한 csv 파일을 처리합니다. 작업은 디렉토리에서 제품 및 범주를 확인하고 파일을 처리합니다.

범주 파일 데이터는 다음과 같습니다.

대량 데이터 할당 샘플 - 범주
대량 데이터 할당 샘플 - 범주

상품 파일 데이터는 다음과 같습니다.

대량 할당 데이터 샘플 - 제품
대량 할당 데이터 샘플 - 제품

이 작업은 동일한 실행에서 카테고리 및 제품에 대한 csv 파일을 처리합니다. 이 작업은 디렉토리에서 제품 및 범주를 확인하고 파일을 처리합니다.

범주

  1. 판매자 도구 - > 브라이트코브 - > 대량 할당으로이동합니다.
  2. 범주를선택합니다.
  3. .csv 파일을 선택합니다.
  4. 제출을 클릭합니다.
    CSV 파일 제출 - 범주
    CSV 파일 제출 - 범주
  5. 파일이{Site-ID} /대량 할당 범주폴더 아래의Temp디렉토리에 업로드됩니다.
    대량 할당 범주 폴더
    대량 할당 범주 폴더
  6. 관리 - > 작업으로이동합니다.
  7. 대량 할당작업을 선택하고실행을누릅니다.
  8. 작업 완료 상태를 확인합니다.
    작업 완료 상태 - 대량 지정 범주
    작업 완료 상태 - 대량 지정 범주
  9. 할당된 비디오를 확인합니다.
    비디오 할당 확인 - 범주
    비디오 할당 확인 - 범주
  10. 대량 할당 작업에 의해 처리된 파일은Temp디렉터리 아래의대량 할당 카테고리 처리폴더로 이동됩니다.

제품

  1. 판매자 도구 - > 브라이트코브 - > 대량 할당으로이동합니다.
  2. 제품을선택합니다.
  3. .csv 파일을 선택합니다.
  4. 제출을 클릭합니다.
    CSV 파일 제출 - 제품
    CSV 파일 제출 - 제품
  5. 파일이{Site-ID} /대량 할당 제품폴더 아래의Temp디렉토리에 업로드됩니다.
    대량 지정 제품 폴더
    대량 지정 제품 폴더
  6. 관리 - > 작업으로이동합니다.
  7. 대량 할당작업을 선택하고실행을누릅니다.
  8. 작업 완료 상태를 확인합니다.
    작업 완료 상태 - 대량 제품 지정
    작업 완료 상태 - 대량 제품 지정
  9. 할당된 비디오를 확인합니다.
    비디오 할당 확인 - 제품
    비디오 할당 확인 - 제품
  10. 대량 할당 작업에 의해 처리되는 파일은Temp디렉터리 아래의BulkAssignProduct_Product_Product_Product_Product

샘플 구현

다음은 브라이트코브 동영상의 샘플 구현에 대한 몇 가지 페이지입니다.

SFRA (매장 참조 아키텍처)

범주 (캣랜딩, 검색결과노드 데코레이터)

범주 샘플
범주 샘플
범주 샘플 상세내역
범주 샘플 상세내역

제품 페이지 마스터/변형 제품 (제품 상세 정보)

제품 샘플 1
제품 샘플 1
제품 샘플 2
제품 샘플 2

제품 페이지 - 표준 제품 (제품 상세 정보)

표준 제품
표준 제품

상품 페이지 - 선택사항 그룹 (상품 상세 정보)

선택사항 그룹
선택사항 그룹
선택사항 그룹
선택사항 그룹

제품 페이지 - 제품 세트 (세부 정보 설정)

제품 세트 세부 정보
제품 세트 세부 정보

제품 페이지 - 제품 번들 (번들 세부 정보)

제품 세트 세부 정보
제품 세트 세부 정보

사이트 제네시스 아키텍처

범주 페이지 (캣랜딩, 범주생산)

범주 소개 페이지
범주 소개 페이지
범주 세부 정보 페이지
범주 세부 정보 페이지

제품 페이지 - 마스터/변형 (제품콘텐츠, 제품콘텐츠)

제품 페이지 샘플
제품 페이지 샘플
제품 페이지 샘플
제품 페이지 샘플

제품 페이지 - 표준 제품 (제품콘텐츠, 제품콘텐츠)

 표준 제품 페이지 샘플
표준 제품 페이지 샘플

상품 페이지 - 선택사항 그룹 (상품콘텐츠, 제품콘텐츠)

선택사항 그룹 페이지 샘플
선택사항 그룹 페이지 샘플
선택사항 그룹 페이지 샘플
선택사항 그룹 페이지 샘플

제품 페이지 - 제품 세트 (제품콘텐츠P)

제품 세트 페이지 샘플
제품 세트 페이지 샘플

제품 페이지 - 제품 번들 (제품콘텐츠P)

제품 세트 번들 샘플
제품 세트 번들 샘플