상세페이지에 수동으로 영상 넣기

레거시 방식입니다

이 방식은 옵션을 바꿀 때마다 코드를 다시 만들어 쇼핑몰에 재삽입해야 합니다. 위젯 스튜디오에서 프리셋으로 만들면 설치 코드는 그대로 두고 스타일과 콘텐츠만 바꿔도 바로 반영됩니다. 새로 시작하신다면 스튜디오를 쓰세요.

이미 이 방식으로 붙여둔 코드는 그대로 두어도 계속 동작합니다.

TIP

쇼츠웍스는 상품 태깅 기능과 상품 페이지 주소를 매칭하는 방식을 통해 자동으로 상세페이지에 지정된 영역에 플레이어를 넣는 기능이 있는데요. 해당 가이드에서는 수동으로 상세페이지 내에 영상을 임베드 하는 방법을 설명드리겠습니다.

해당 기능은 현재 PC 웹 어드민의 관리페이지에서 액세스가 가능합니다. 아직 모바일웹이나 앱에서는 접근이 어려우니 참고부탁드립니다.

1. 퍼가기 메뉴에 진입하기

2. 퍼가기 팝업에서 원하는 임베드 형태 선택 및 복사

쇼츠웍스 쇼츠의 '퍼가기' 창. ① 퍼가기 방식을 '아이프레임'으로 두고 플레이어 컨트롤러·동영상 채우기·쇼츠 제목·좋아요·공유하기·상품 태그·부드러운 모서리를 켜고 끈다. ② 아래 코드 상자의 <iframe …> 을 '복사하기' 로 복사한다.

• 퍼가기 방식: 카페24에서 에디봇 내에 영상을 넣고자 하는 경우 “아이프레임”을 선택해주셔야 하며, 그밖에는 “스크립트” 방식을 선택하셔도 괜찮습니다.
• 플레이어 컨트롤러: 상단의 플레이바 및 뮤트 버튼 온오프 여부를 선택할 수 있습니다.
• 동영상 채우기: 동영상이 들어가있는 너비에 가득차게 넣고 싶은 경우 해당 옵션을 켜주시면 됩니다.
• 쇼츠 제목: 영상 내 상단에 타이틀의 표시여부를 선택할 수 있습니다.
• 좋아요 버튼: 우하단의 좋아요 버튼의 표시여부를 선택할 수 있습니다.
• 공유하기 버튼: 우하단의 공유하기 버튼의 표시여부를 선택할 수 있습니다.
• 상품 태그: 하단에 상품 상세페이지로 랜딩되는 상품태그의 표시여부를 선택할 수 있습니다.
• 부드러운 모서리(각진 모서리): 모서리를 부드럽게 넣을지, 각진 모서리로 넣을지 선택할 수 있습니다.

3. 상세페이지에 복사한 코드 넣기

• 카페24 상품페이지 에디봇에서 넣기
  1. 카페24 상품목록에서 상세페이지를 편집할 상품에 진입합니다.

카페24 관리자 [상품] - ① [상품목록] 에서 ② 영상을 넣을 상품의 상품명을 클릭한다.

2. 에디봇에 진입해주세요.

카페24 상품 수정의 [기본정보] 탭. '상품 상세설명' 에서 '에디봇 작성' 을 고르고 '에디봇 수정하기' 를 누른다.

3. 에디봇에서 “HTML 입력” 메뉴를 선택해주시고, 쇼츠웍스에서 복사한 아이프레임 코드를 입력해주시고, “적용”을 클릭해주세요.

에디봇 편집기. ① 왼쪽 도구모음에서 'HTML' 을 누르고 ② 열린 'HTML 입력' 창에 복사한 iframe 코드를 붙여넣은 뒤 ③ '적용' 을 누른다.

• 카페24 상품페이지에서 직접 작성하기로 넣기

에디봇 대신 직접 작성으로 넣는 방법. ① '직접 작성' 탭을 고르고 ② 편집기 오른쪽의 <>(HTML 편집) 버튼을 누른 뒤 ③ iframe 코드를 붙여넣고 ④ '상품수정' 으로 저장한다.

1. 상품 페이지에서 [직접작성] 탭으로 진입합니다.
2. 코드 보기를 클릭해주세요.
3. 쇼츠웍스에서 복사한 아이프레임(혹은 스크립트) 코드를 붙여넣기 해주세요.
4. 상품 수정을 하면 반영됩니다.

• 플렉스지 상품 페이지에서 영상 넣기

  1. 플렉스지 상품 상세페이지 진입하기

     

  2. 상세페이지 에디터 하단에 HTML 탭을 클릭하고, 상세페이지 내용에 퍼가기 메뉴에서 복사한 코드를 읿력하면 영상이 적용됩니다.

메이크샵 상품수정 - [상품 상세정보 등록] 화면. ① 상세정보 편집기 오른쪽 아래의 'HTML' 탭으로 전환한 뒤 ② 입력창에 iframe 코드를 붙여넣고 '적용' 을 누른다.