SEEN Video Player – SEEN Documentation

Using Standalone SEEN Video Player

SEENs video player is usable as a standalone link. If used as a standalone player, the page offers a full screen experience for the receiver.

Standalone player domains follow the below structure: https://player.seen.io/v/AhdlZ6Qq28LDQAptGHUY

Base URL: https://player.seen.io/v/

Video Identifier: AhdlZ6Qq28LDQAptGHUY

Each video has their unique Video Identifier.

Embedding the SEEN Video Player

Integrate SEEN’s video player seamlessly into your website or application with a simple HTML snippet. Follow the steps below to embed the player and customize its appearance.

1. Basic Integration

To embed the SEEN video player on your webpage, include the following <iframe> snippet in your HTML code:

<iframe src="https://player.seen.io/v/AhdlZ6Qq28LDQAptGHUY"
        style="aspect-ratio: 16 / 9; width: 900px; border: 0;"
        webkitallowfullscreen mozallowfullscreen allowfullscreen>
	</iframe>

Understanding the URL Structure:

Base URL: https://player.seen.io/v/

Video Identifier: AhdlZ6Qq28LDQAptGHUY

Parameters Explained:

src: The URL of the SEEN video player with the specific video ID.

aspect-ratio: Maintains a responsive 16:9 aspect ratio for optimal video scaling.

width: Defines the width of the player (default: 900px). Adjust as needed.

border: Removes the default iframe border for a clean look.

webkitallowfullscreen, mozallowfullscreen, allowfullscreen: Enables full-screen playback on different browsers.

2. Customising the Player

You can modify the width or adjust the aspect ratio to fit your design:

Responsive Width Example:

To make the video player responsive, use CSS instead of a fixed width:

<style>
  .seenio-player {
    width: 100%;
    max-width: 900px;
  }
</style>

<iframe class="seenio-player"
        src="https://player.seen.io/v/AhdlZ6Qq28LDQAptGHUY"
        style="aspect-ratio: 16 / 9; border: 0;"
        webkitallowfullscreen mozallowfullscreen allowfullscreen>
</iframe>

Adjusting Aspect Ratio:

For different aspect ratios (e.g., 4:3 instead of 16:9), update the style attribute:

style="aspect-ratio: 4 / 3; width: 800px; border: 0;"

3. Dynamic Video Embedding

If you want to dynamically load different videos, replace the src attribute with a dynamic value from your backend or JavaScript:

<iframe id="seenioPlayer"
        src=""
        style="aspect-ratio: 16 / 9; width: 900px; border: 0;"
        webkitallowfullscreen mozallowfullscreen allowfullscreen>
</iframe>

<script>
  const videoId = "AhdlZ6Qq28LDQAptGHUY"; // Replace dynamically as needed
  document.getElementById("seenioPlayer").src = `https://player.seen.io/v/${videoId}`;
</script>

4. Need Help?

For further customisation or API integration, contact our support team at support@seen.io.