การแสดงผลวิดีโอแบบ iframe OutStream

การแสดงผลวิดีโอแบบ iframe OutStream สามารถทำได้โดย

1. เพิ่มแท็ก <div> ในจุดที่ต้องการจะแสดงผลวิดีโอแบบ OutStream โดยต้องระบุแอททริบิวต์ id ซึ่งจะใช้อ้างอิงในขั้นตอนถัดๆ ไป ดังตัวอย่าง

<div id="outstream-container"></div>

2. เพิ่ม ByteArk OutStream SDK ที่แท็ก <script> ใน html

<script src="https://byteark-sdk.cdn.byteark.com/outstream/@latest/byteark-outstream-sdk.min.js"></script>

3. เพิ่มสคริปท์ต่อไปนี้หลังจากแท็ก <script> ในข้อ 2. เพื่อเปิดใช้งานตัวเล่นวิดีโอแบบ OutStream กับแท็ก <div> ที่ได้สร้างไว้ในข้อ 1. และระบุ contentUrl ที่ต้องการจะใช้เล่น โดย contentUrl สามารถหาได้จากหน้า video detail บน ByteArk Stream ในหัวข้อ Video Link

<script>
  var sdk = new window.ByteArkOutStreamSDK({
    elementId: 'outstream-container', // ID of the element to make float (required)
    contentUrl: 'https://stream-player.byteark.com/players/614d5df44a9a7e00b4dc3eb6/videos/U686mpQ72zCw', // URL for iframe src
    // position: 'bottom-left', // 'bottom-left' or 'bottom-right' (default: 'bottom-right')
    // animation: true, // Enable smooth transitions (default: true)
  });
</script>