Video SDK

Integration

The video SDK allows you to easily embed a PopJam video playlist and channel feed in your application.

Info Contents
Contact popjam-support@superawesome.com
License GNU Lesser General Public License v3
_images/video.png

The process to do this is very simple:

Step 1. Create a container for the embedded tool and provide a width and height

<body>
    <!-- (...) -->

    <!-- Create a container for the PopJam video widget and assign an id -->
    <div id="popjam-video-container" style="width: 30%;"></div>

    <!-- (...) -->
</body>

Step 2. Include the video sdk script and set the desired parameters as explained in the comments below

<body>
    <!-- (...) -->

    <!-- Create a container for the PopJam video widget and assign an id -->
    <div id="popjam-video-container" style="width: 30%;"></div>

    <!-- (...) -->

    <!--
        Include the PopJam SDK and pass attributes via the data prefix
        List of attributes:
        - data-container - the id of the created container element above (REQUIRED)
        - data-feed-id - the id of the feed to get the videos and posts from (REQUIRED)
        - data-auto-play - true/false | set to autoplay on load (OPTIONAL)
        - data-ads-pre-roll-placement-id - AwesomeAds placement id for preroll advertising (OPTIONAL)
        - data-in-feed-ads-placement-id - AwesomeAds placement id for in feed ads (OPTIONAL)
        - data-attribution-campaign-id - AwesomeAds campaign id for PopJam install attribution (OPTIONAL)
        - data-max-posts - set the maximum number of posts (OPTIONAL)
        - data-deeplink - boolean to enable or disable deeplink functionality (OPTIONAL)
        - data-bundle-id - bundle id of the app to be reflected in the stats (OPTIONAL)
    -->

    <script
        src="https://sdk.popjam.com/v1/web/video/widget.min.js"
        data-container="popjam-video-container"
        data-feed-id="e4b9399d-a0e8-4642-a63c-4e061e6a11eb"
    ></script>
</body>

Let’s put it all together in an example website:

<!doctype html>

<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>PopJam Integration Demo</title>
        <meta name="description" content="PopJam Integration Demo">
        <meta name="author" content="SuperAwesome">
    </head>

    <body>
        <div id="popjam-video-container" style="width: 30%"></div>

        <script
            src="https://sdk.popjam.com/v1/web/video/widget.min.js"
            data-container="popjam-video-container"
            data-feed-id="e4b9399d-a0e8-4642-a63c-4e061e6a11eb"
        ></script>
    </body>
</html>

Mobile

The video SDK can easily be embedded in a webview by invoking the follow URL:

Note

The query parameters (camelcased) match the parameters configured through the data-* attribute in the web integration.

Intercepting deeplink calls. For deeplinks to work, the call needs to be intercepted and redirected to a browser.

See here on how to do that.