These are the steps to include your customized collection beacon that will connect to the Datazoom cloud SDK from your PLYR video player:
-
Login to Datazoom here: https://app.datazoom.io
-
Add a Collector as indicated here: How to add a Collector
-
Copy the
Config
that was created at the end of the process
Click the icon indicated below to copy the Configuration Key
You will see this message:
-
Replace the
<CONFIG_ID>
in Datazoom's beacon script with the Key you copied above.
Replace the entire placeholder<CONFIG_ID>
including<
and>
IMPORTANT: Datazoom's beacon script must come after the player load.
Example:
<html> <head> <link rel="stylesheet" href="https://cdn.plyr.io/3.4.4/plyr.css"> <script src="https://cdn.plyr.io/3.4.4/plyr.js"></script> </head> <body> <div class="vid-container" id="plyr_player"> <video id="myPlayers" controls preload="auto" style="width:100%;height:25em;background: black;"> <source src=<VIDEO_SOURCE> type="video/mp4"> </video> </div> <script> var video = document.getElementsByTagName("video")[0]; var myPlayer = new Plyr(video); </script> <!-- THIS IS THE DATAZOOM BEACON SCRIPT --> <script src='https://platform.datazoom.io/beacon/v1/config?configuration_id=<config_ID>'></script> </body> </html>
Comments
0 comments
Article is closed for comments.