# 홈 페이지통합

이 페이지는 귀하의 웹사이트 홈 페이지에 Virtusize를 통합하는 방법을 안내합니다. 이 과정은3단계로 이루어져 있습니다:

1. 플레이스홀더 추가하기

현재 하나 종류의 위젯을 지원합니다:

  • 피팅룸 디스커버리

이 위젯은 페이지의 어디에나 배치할 수 있지만, 플레이스홀더를 사용하여 배치를 지정하는 것이 좋습니다. 플레이스홀더를 추가하면 향후 Virtusize 위젯이 깨지는 것에 대해 걱정하지 않고 페이지 디자인을 자유롭게 변경할 수 있습니다.

2. Virtusize 스크립트 통합하기

이 스크립트는 위젯을 표시하는 중앙 애플리케이션을 호출하는 데 필요합니다.

3. 검증

# 시작하기 전에

귀하의 영업 담당자에게 연락하여 상점 이름을 받으십시오.

# 1. 플레이스홀더 추가하기

귀하의 영업 담당자와 상담하여 Virtusize 태그의 최적 위치를 결정하십시오.


Virtusize 피팅룸 디스커버리 (FRD) 위젯을 통합하는 경우, 표시할 위치에 플레이스홀더 태그를 추가하십시오:

<div class="vs-placeholder-frd"></div>

인페이지 스탠다드, 인페이지 미니멀, 스마트 테이블, FRD 및 키즈 위젯을 여러 개 추가하려면 추가 플레이스홀더 태그를 삽입하면 됩니다.

# 2. Virtusize 스크립트 통합하기

스크립트는 각 환경에 대한 변수를 설정하여 쉽게 통합할 수 있습니다. 아래 스크립트를 </body> 태그가 닫히기 바로 전에 배치하고, STORE_NAME, ENVIRONMENT, DEVICE_TYPE, USER_ID을 올바른 값으로 대체하십시오.

const vsObject = {
  storeName: "STORE_NAME",
  env: "ENVIRONMENT",
  deviceType: "DEVICE_TYPE",
  userId: "USER_ID",
  page: "topPage"
};

(function() {
  window.vs = !window.hasOwnProperty("vs")
    ? vsObject
    : Object.assign(window.vs, vsObject);

  const { storeName, env, deviceType } = vsObject;
  const script = document.createElement("script");
  const firstScript = document.getElementsByTagName("script")[0];
  const protocol = document.location.protocol ? 'https' : 'http'

  Object.assign(script, {
    async: true,
    src: `${protocol}://integration.virtusize.kr/${env}/${storeName}/${deviceType}.source.js`,
  });

  firstScript.parentNode.insertBefore(script, firstScript);
})();
설명
STORE_NAME 이것은 귀하의 영업 담당자로부터 받은 스토어 이름 입니다.
ENVIRONMENT 이것은 통합 중인 환경에 따라 staging 또는 production 일 수 있습니다.
DEVICE_TYPE 이것은 페이지에 접근하는 장치 유형에 따라 desktop 또는 mobile일 수 있습니다. 사이트가 반응형일 경우(데스크톱과 모바일 장치에 동일한 리소스를 제공하는 경우) desktop으로 설정하십시오.
USER_ID 사용자가 로그인하지 않은 경우 빈 문자열('')로 설정합니다.
-사용자가 로그인한 경우 사용자 ID를 해시 함수(MD5, SHA-1 등)를 사용하여 설정합니다.

# 3. 검증

통합을 완료한 후, 홈 페이지 URL을 귀하의 영업 담당자와 공유하십시오.