Script Embed
This is the easiest way to integrate Wistia with Videoken. The standard embed code you obtain from Wistia Dashboard is of the format
<script src="https://fast.wistia.com/embed/medias/<video-id>.jsonp" async></script>
<script src="https://fast.wistia.com/assets/external/E-v1.js" async></script>
<div class="wistia_responsive_wrapper" style="width:900px;height:540px;">
<div class="wistia_embed wistia_async_<video-id> videoFoam=true" style="height:100%;position:relative;width:100%">
<div class="wistia_swatch" style="height:100%;left:0;opacity:0;overflow:hidden;position:absolute;top:0;width:100%;">
<img src="https://fast.wistia.com/embed/medias/<video-id>/swatch"
style="filter:blur(5px);height:100%;width:100%;"
onload="this.parentNode.style.opacity=1;"
/>
</div>
</div>
</div>
To add videoken controls to the above embed, add a script just after the original embed code so that the final embed code looks like the following.
<script src="https://fast.wistia.com/embed/medias/<video-id>.jsonp" async></script>
<script src="https://fast.wistia.com/assets/external/E-v1.js" async></script>
<div class="wistia_responsive_wrapper" style="width:900px;height:540px;">
<div class="wistia_embed wistia_async_<video-id> videoFoam=true" style="height:100%;position:relative;width:100%">
<div class="wistia_swatch" style="height:100%;left:0;opacity:0;overflow:hidden;position:absolute;top:0;width:100%;">
<img src="https://fast.wistia.com/embed/medias/<video-id>/swatch"
style="filter:blur(5px);height:100%;width:100%;"
onload="this.parentNode.style.opacity=1;"
/>
</div>
</div>
</div>
<script src="https://content.videoken.com/players/wistia.js"></script>
Find a sample integration running below.