Skip to content

Clappr

We will guide you through the configuration of Clappr. After this tutorial, you will be fully compatible with Strive's Flink technology.

Prerequisites

You have configured your origin.

You have configured your CDN.

You have a Strive Flink Stream set up.

How to integrate your Stream into your website

1. Update the <head> section:

First, you have to embed our JavaScript at the HEAD section of your website. You should embed our script before you load your player's library.

You will need your stream's token from the stream's detail page at our dashboard. The token will look something like:

token example: ef69bdc6a38e4gh2ae761ffv6c648caf

<!-- Strive Flink integration -->
<script type="text/javascript" src="https://cdn.strivecdn.com/p2pdn/p2pdn.latest.min.js?token=<YOUR_TOKEN>"></script>

<!-- Clappr library -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/clappr/<YOUR_VERSION>/clappr.min.js"></script>

2. And integrate the player in your <body> section:

This is basically the standard player integration, your player does not need to know anything about Flink.

<div id="videoplayer"></div>
<script>
  var player = new Clappr.Player({
    source: "<PLAYLIST_URL>",
    parentId: "#videoplayer"
  });
</script>

Congrats, you integrated Strive Flink! What's left to do is verifying that everything works correctly.

Next step

Verify Strive Flink is working fine.