The Intractive Player allows you to embed your story directly on your website or web app with minimal configuration. This allows you to keep visitors on your web page without redirecting them.
Step 1. Include Intractive Player script
Include the following script between right before the </body> tag on your website, if you haven't already done so.
<script>(function(w,d){
w.IntractivePlayer=function(){w.IntractivePlayer.q.push(arguments)};w.IntractivePlayer.q=[];
function r(){var s=document.createElement('script');s.async=1;s.type='text/javascript';s.src='https://embed.intractive.app/v2';(d.body||d.head).appendChild(s);}
if(w.attachEvent){w.attachEvent('onload',r)}else{w.addEventListener('load',r,false)}
})(window, document)</script>
Step 2. Find your ID
To link the correct story to the script, you need to find the ID. It is the last part of the link to your story.
Step 3. Launch player
There are two options to launch your story.
As a Pop-up, or as an Embed Inline.
Pop-Up
Method 1. Using a link
To open this story in a pop-up when a user clicks on an anchor tag, you can use the following code:
// Replace YOUR-ID with with the actual ID
<a href="https://links.intractive.app/YOUR-ID?embed=1">Open experience</a>
It's also possible to add the data-intractive-open attribute to any HTML element.
// Replace YOUR-ID with with the actual ID
<button data-intractive-open="YOUR-ID"></button>
Method 3. Using the Javascript API
If you need more control, you can use JavaScript to open or close the pop-up.
// Open the pop-up window, replace YOUR-ID with with the actual ID
window.IntractivePlayer("open", "YOUR-ID");
// Close the instance that is currently opened
window.IntractivePlayer("close");
Embed inline
1. Embed the player directly in your web page
Adjust the options below and paste the HTML code at the location where you want to embed your story.
// Replace YOUR-ID with with the actual ID
<div data-intractive-embed="YOUR-ID"></div>