Overview

The Interstitial Ad Unit is an easy way to show video ads wrapped in display ads before games, downloads, or any content. The latest version of the Interstitial Ad Unit makes showing an ad experience easy and seamless, while adding additional display revenue. Once the ad is finished, the unit automatically reveals your content. View the Interstitial Game Demo to see a real life example, or try the demos below.

Simple Usage:

  • Implementation is fairly straightforward
  • 2 scripts must be included in the <head>
  • On the page, or via an external js file, trigger the Interstitial unit using tyche.showInterstitial()
  • An overlay will load with 3 display ad units surrounding a video ad unit
  • When the video ad completes playback, the overlay will disappear


<!DOCTYPE html>
<html>
<head>
<title>Interstitial Ad Unit Example</title>

<!-- Tyche Interstitial Video Demo Script  -->
<script type="text/javascript">
var tyche = { 
			mode: 'tyche', 
			config: '//m6s9f6i3.ssl.hwcdn.net/1022892/v2/websites/70758/banner.json'
	};
</script>

<script id="tyche" 
		src="//cdn.intergi.com/hera/tyche.js" 
		type="text/javascript">
</script>

</head>
<body>

<button id="show">Show Interstitial</button>

<script>

var showBtn = document.getElementById('show');

showBtn.addEventListener('click', function() {

	// trigger the interstitial ad unit
	tyche.showInterstitial();

});

</script>

</body>
</html>

Callback Usage

  • The Interstitial unit function call supports a callback
  • Pass a callback into the tyche.showInterstitial() function
  • In our demo, the interstitialCallback() function simply displays an alert message when the Interstitial Ad Unit is completed


<!DOCTYPE html>
<html>
<head>
<title>Interstitial Ad Unit Example</title>

<!-- Tyche Interstitial Video Demo Script  -->
<script type="text/javascript">
var tyche = { 
			mode: 'tyche', 
			config: '//m6s9f6i3.ssl.hwcdn.net/1022892/v2/websites/70758/banner.json'
	};
</script>

<script id="tyche" 
		src="//cdn.intergi.com/hera/tyche.js" 
		type="text/javascript">
</script>

</head>
<body>

<button id="callback">Interstitial With Callback</button>

<script>

var callbackBtn = document.getElementById('callback');

callbackBtn.addEventListener('click', function() {

	// trigger the interstitial, passing in a callback
	tyche.showInterstitial(interstitialCallback);

});

function interstitialCallback(){
	alert('interstitialCallback fired, close this alert to continue');
}

</script>

</body>
</html>

  • Was this Support Article Helpful ?
  • yes   no