Guides

기본 사용법

이 페이지는 소스클립 플레이어 라이브러리를 사용하는 과정을 안내합니다.

소스클립 플레이어의 위치와 레이아웃을 직접 설정하여 웹 페이지에 설치합니다.

Player 설치 하기

소스클립의 위치와 레이아웃을 설정하여 웹 페이지에 설치한 뒤, 컨테이너 레이아웃의 스타일을 지정합니다.

아래의 코드 적용 시 기본 플레이어를 실행할 수 있습니다.

파트너ID 는 파트너 계약을 완료하고 모비두 담당자가 안내하거나, 직접 문의해 볼 수 있습니다.

클립 ID 는 소스의 어드민에서 클립 등록을 완료하면 목록에서 확인할 수 있습니다.

<!doctype html>
<html lang="ko">
  <head>
    <meta charset="utf-8" />
    <meta
      name="viewport"
      content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"
    />
    <script src="https://player.sauceclip.com/static/js/SauceClipPlayerLib.js"></script>
        //(스테이지 환경 사용시 stage.player.sauceclip... 로 변경하시면 됩니다.)
  </head>
  <body>
    <div id="root"></div>
    <script>
      window.addEventListener('load', () => {
        // 파트너 ID와 클립 ID를 입력해주세요
        window.SauceClipPlayerLib.setInit({
          partnerUniqueId: '파트너ID',
          clipId: '클립ID',
          elementId: 'root'
        });
        window.SauceClipPlayerLib.load();
      });
    </script>
  </body>
</html>