다음을 통해 공유


활성 이미지 모듈

비고

Dynamics 365 Commerce의 소매 관심 그룹이 Yammer에서 Viva Engage로 이동했습니다. 새 Viva Engage 커뮤니티에 액세스할 수 없는 경우 이 양식(https://aka.ms/JoinD365commerceVivaEngageCommunity)을 작성하여 추가하고 최신 토론에 계속 참여하세요.

이 문서에서는 활성 이미지 모듈에 대해 다루고 Microsoft Dynamics 365 Commerce의 사이트 페이지에 모듈을 추가하는 방법을 설명합니다.

활성 이미지 모듈을 사용하여 이미지에 제품 태그를 포함할 수 있습니다. 전자상거래 사이트 이용자는 태그 위에 마우스를 올리면 이미지에 표시된 상품을 미리 볼 수 있습니다. 미리 보기는 팝업 창에 표시됩니다. 미리보기 팝업 창을 선택하면 사용자는 해당 제품의 제품 상세 페이지(PDP)로 바로 이동할 수 있습니다.

태그는 이미지의 X 및 Y 좌표를 사용하여 정의됩니다. 태그가 지정된 각 포인트는 이미지에 표시된 제품의 제품 ID로 구성해야 합니다.

다음 그림은 Adventure Works 홈페이지의 히어로 이미지에 표시되는 미리보기 팝업 창의 예시를 보여줍니다.

활성 이미지 모듈의 미리 보기 팝업 창 예시

중요

  • 활성 이미지 모듈은 Dynamics 365 Commerce 버전 10.0.20 릴리스부터 사용할 수 있습니다.
  • 활성 이미지 모듈은 Adventure Works 테마에 표시됩니다.

활성 이미지 모듈 속성

속성 이름 설명
이미지 이미지 파일 이미지는 하나 이상의 제품을 소개하는 데 사용할 수 있습니다. 이미지는 상거래 사이트 작성기의 미디어 라이브러리에 업로드하거나 기존 이미지를 사용할 수 있습니다.
너비 픽셀 수 이 속성은 이미지의 너비를 정의합니다. 활성 좌표는 이미지의 너비를 기준으로 계산됩니다.
활성 좌표 X 및 Y 좌표, 제품 ID 번호 각 활성 이미지 배열은 X 및 Y 좌표와 제품 ID 번호로 구성됩니다.
제목 제목 텍스트 및 제목 태그(H1, H2, H3, H4, H5 또는 H6) 기본적으로 제목에는 H2 제목 태그가 사용되지만 접근성 요구 사항에 맞게 태그를 변경할 수 있습니다.
단락 단락 텍스트 이 모듈은 서식 있는 텍스트 형식의 단락 텍스트를 지원합니다. 기본적인 리치 텍스트 기능이 지원됩니다. 예를 들어 하이퍼링크, 굵게, 밑줄, 기울임 텍스트 등이 포함됩니다. 이러한 기능 중 일부는 모듈에 적용되는 페이지 테마로 재정의할 수 있습니다.
연결 링크 텍스트, 링크 URL, ARIA 레이블, 새 탭에서 링크 열기 선택기 모듈은 하나 이상의 "클릭 유도문안" 링크를 지원합니다. 링크를 추가하는 경우 링크 텍스트, URL 및 레이블이 ARIA 필요합니다. ARIA 레이블은 접근성 요구 사항을 충족하기 위해 설명적이어야 합니다. 링크가 새 탭에서 열리도록 구성할 수 있습니다.
하위 텍스트 제목, 텍스트 및 링크 작성자 또는 디자이너 이름 또는 개인 블로그에 대한 링크와 같은 이미지에 대한 추가 컨텍스트를 추가할 수 있습니다.
텍스트 테마 라이트 또는 다크 이 속성을 사용하면 사용자가 배경 이미지에 따라 텍스트를 밝게 또는 어둡게 설정할 수 있습니다. Adventure Works 테마에서 테마 확장으로 사용할 수 있습니다.

새 페이지에 활성 이미지 모듈 추가

새 페이지에 활성 이미지 모듈을 추가하고 필요한 속성을 설정하려면 다음 단계를 수행합니다.

  1. 템플릿으로 이동하여 사이트 홈페이지용 마케팅 템플릿을 엽니다(또는 새 마케팅 템플릿을 생성합니다).
  2. 기본 페이지의 기본 슬롯에서 줄임표(...)를 선택한 다음 모듈 추가를 선택합니다.
  3. 모듈 선택 대화 상자에서 활성 페이지 모듈을 선택한 다음 확인을 선택합니다.
  4. 저장을 선택하고, 편집 완료를 선택하여 템플릿을 확인한 다음, 게시를 선택하여 게시하세요.
  5. 페이지로 이동하여 사이트의 홈페이지를 엽니다(또는 마케팅 템플릿을 사용하여 새 홈페이지를 생성합니다).
  6. 기본 페이지의 메인 슬롯에서 점 세 개 버튼()을 선택한 후 모듈 추가를 선택하세요.
  7. 모듈 선택 대화 상자에서 활성 페이지 모듈을 선택한 다음 확인을 선택합니다.
  8. 활성 이미지 모듈의 속성 창에서 이미지를 추가하고 캔버스 너비를 이미지 크기로 설정합니다.
  9. X 및 Y 좌표를 설정하고 적절한 제품 ID 번호를 추가합니다.
  10. 필요에 따라 활성 이미지 모듈을 추가하고 구성합니다.
  11. 저장을 선택한 다음 미리 보기를 선택하여 페이지를 미리 봅니다.
  12. 편집 완료를 선택하여 템플릿을 체크인한 다음, 게시를 선택하여 게시합니다.

추가 리소스

모듈 라이브러리 개요

Adventure Works 테마