GuidesAPI Reference
Guides

숏폼 바로 재생하기

Suggest Edits

Shortform을 전체화면으로 재생하는 showShortformPlayerModal() 을 통해 숏폼피드를 바로 재생할 수 있습니다.

📘

showShortformPlayerModal() 은 페이지 유입즉시 실행하는 구성이 가능한 관계로, Autoplay 정책준수를 위해 무음 상태로 재생됩니다

  • '동일' 페이지 내의 사용자 클릭을 통한 실행시 muted 파라미터 조정을 통해 unmute 상태 재생이 가능합니다.



기본적인 숏폼피드

기본적인 노출 순서에 따라 숏폼피드를 노출합니다.

<script defer>
  cloud.shoplive.showShortformPlayerModal();
</script>

태그로 숏폼피드 재생

Shoplive Shortform의 컨텐츠마다 설정한 태그를 사용하여 구성한 목록을 피드를 재생합니다.

1개의 태그를 사용하여 피드를 구성할 수 있습니다.


<script defer>
  cloud.shoplive.showShortformPlayerModal( { 
    tags: ["your_tag"] 
  });
</script>

여러개의 태그를 포함하는 검색 조건으로 목록을 구성할 수 있습니다. 태그 최대 5개까지 설정 가능하며 OR조건으로 동작합니다.

<script defer>
  cloud.shoplive.showShortformPlayerModal( { 
    tags: ["your_tag1", "your_tag2"] 
  });
</script>

여러 개의 태그로 숏폼을 구성할 때, tagSearchOperator="AND" 옵션을 추가하여 해당 태그를 모두 포함하는 조건(AND조건)으로 구성할 수 있습니다.

<script defer>
  cloud.shoplive.showShortformPlayerModal({ 
    tags: ["your_tag1", "your_tag2"],
    tagSearchOperator: "AND"
  });
</script>

브랜드로 숏폼 목록 구성하기

Shoplive Shortform의 컨텐츠마다 설정한 브랜드의 '식별자'를 사용하여 브랜드별 목록을 구성할 수 있습니다.

1개의 브랜드를 사용하여 목록을 구성할 수 있습니다.

<script defer>
  cloud.shoplive.showShortformPlayerModal( { 
    brands: ["brand_idetifier"] 
  });
</script>

여러 개의 브랜드를 포함한 숏폼 목록을 구성하려면, 브랜드 식별자를 배열에 포함하세요. 브랜드는 최대 5개까지 설정 가능합니다.

<script defer>
  cloud.shoplive.showShortformPlayerModal( { 
    brands: ["brand_idetifier1", "brand_idetifier2"] 
  });
</script>

숏폼 목록 순서를 랜덤으로 노출하기

목록 내 숏폼의 순서를 무작위로 노출되도록 구성할 수 있습니다. 

<script defer>
  cloud.shoplive.showShortformPlayerModal( { 
    shuffle: true 
  });
</script>

태그나 브랜드로 목록 구성과 함께 사용될 수 있습니다.

<script defer>
  cloud.shoplive.showShortformPlayerModal( { 
    brands: ["brand_idetifier1"],
    tags: ["your_tag1"],
    shuffle: true
  });
</script>

Shortform id 지정하여 재생

Shortform API 등을 통해 미리 정의한 id의 리스트를 사용하여 숏폼 피드를 재생합니다.

<script defer>
  // Shortform ID를 통하여 playlist 구성
  var ids = ["ID1", "ID2", "ID3", "ID4", "ID5"];
  // 재생이 시작할 startIndex 설정
  var startIndex = 0;
  cloud.shoplive.showShortformPlayerModal({ ids: ids, startIndex: startIndex });
</script>

숏폼 Mute 상태 변경하기

"동일" 페이지에서 사용자 Gesture(예: click)에 의해 showShortformPlayerModal() 을 실행한다면 muted:false 를 사용하여 unmute 상태로 재생할 수 있습니다.

🚧

사용자 동일 웹페이지내의 클릭없이 muted:false를 사용해 실행하면 재생에 실패합니다.

<script>
//사용자의 클릭에 의해 실행되는 playShortform함수
function playShortform() {
  cloud.shoplive.showShortformPlayerModal( { 
    muted:false
  });
}
</script>

Updated 11 months ago