You are using an outdated browser. For a faster, safer browsing experience, upgrade for free today.

Adding AdinPlay Ads to Your Site

The AdinPlay library is a JavaScript library for displaying ads on your website. This document explains how to add the AdinPlay library to your site.

The JavaScript snippet

Adding the following code (known as the "JavaScript snippet") to your site's templates is the easiest way to get started using AdinPlay Ads. The code should be added near the top of the <head> tag and the string 'XXXXX' should be replaced with the property ID (also called the "AIP ID").
<!-- AdinPlay Ads -->
<script>
var aiptag = aiptag || {};
aiptag.cmd = aiptag.cmd || [];
aiptag.cmd.display = aiptag.cmd.display || [];
aiptag.cmd.player = aiptag.cmd.player || [];

//CMP tool settings
aiptag.cmp = {
	show: true,
	position: "centered",  //centered or bottom
	button: true,
	buttonText: "Privacy settings",
	buttonPosition: "bottom-left" //bottom-left, bottom-right, top-left, top-right
}
</script>
<script async src="//api.adinplay.com/libs/aiptag/pub/XXXXX/tag.min.js"></script>

The above code does two main things:

  • Initializes a global aiptag.cmd function (called the aiptag.cmd command queue) that allows you to schedule commands to be run once the AdinPlay Ads JavaScript library is loaded and ready to go.
  • Starts asynchronously downloading the AdinPlay Ads JavaScript library from api.adinplay.com, always use async mode to download the AdinPlay Ads JavaScript library for better user experience. Please make sure the AdinPlay Ads JavaScript library is always loaded after the settings are set like the example above

Custom implementations may require adding additional code to the last line of the JavaScript snippet. However, you should not change the order or the code that loads the AdinPlay Ads JavaScript library.

Displaying and Refreshing Display Ads

The string 'XXXXX_placement' should be replaced with the placement ID (also called the "AIP PLACEMENT ID").

Displaying Display Ads

<div id='XXXXX_placement'>
    <script type='text/javascript'>
    aiptag.cmd.display.push(function() { aipDisplayTag.display('XXXXX_placement'); });
    </script>
</div>

Refreshing Display Ad

aiptag.cmd.display.push(function() { aipDisplayTag.display('XXXXX_placement'); });

Destroying Display Ad

aiptag.cmd.display.push(function() { aipDisplayTag.destroy('XXXXX_placement'); });

Destroying All Display Ads

aiptag.cmd.display.push(function() { aipDisplayTag.destroy(); });

Displaying Video Ads

Create a container to display the Video Ad
<div id="videoad"></div>
Initialize the Video player, this should be done only once per page load.
aiptag.cmd.player.push(function() {
	aiptag.adplayer = new aipPlayer({
		AD_WIDTH: 960,
		AD_HEIGHT: 540,
		AD_DISPLAY: 'default', //default, fullscreen, center, modal-center, fill
		LOADING_TEXT: 'loading advertisement',
		PREROLL_ELEM: function(){return document.getElementById('videoad')},
		AIP_COMPLETE: function (evt)  {
			/*******************
			 ***** WARNING *****
			 *******************
			 Please do not remove the PREROLL_ELEM
			 from the page, it will be hidden automaticly.
			*/
			console.log("Video Ad Completed: " + evt);
		}
	});
});
Show the Video Ad
//check if the adslib is loaded correctly or blocked by adblockers etc.
if (typeof aiptag.adplayer !== 'undefined') {
	aiptag.cmd.player.push(function() { aiptag.adplayer.startVideoAd(); });
} else {
	//Adlib didnt load this could be due to an adblocker, timeout etc.
	//Please add your script here that starts the content, this usually is the same script as added in AIP_COMPLETE.
	console.log("Ad Could not be loaded, load your content here");
}

Displaying Rewarded Ads

Add the following functions to the aipPlayer initialisation.
AIP_REWARDEDNOTGRANTED: function (state)  {
	//This event is fired when a rewarded ad is:
	//timed out, empty, unsupported or closed by the user.
	//don't grand the reward here
	alert("Rewarded ad state: " + state); //state can be: timeout, empty, unsupported or closed.
},
AIP_REWARDEDGRANTED: function ()  {
	alert("Reward Granted");
}
like this
aiptag.cmd.player.push(function() {
	aiptag.adplayer = new aipPlayer({
		AIP_REWARDEDNOTGRANTED: function (state)  {
			//This event is fired when a rewarded ad is:
			//timed out, empty, unsupported or closed by the user.
			//don't grand the reward here
			alert("Rewarded ad state: " + state); //state can be: timeout, empty, unsupported or closed.
		},
		AIP_REWARDEDGRANTED: function ()  {
			alert("Reward Granted");
		},
		AD_WIDTH: 960,
		AD_HEIGHT: 540,
		AD_DISPLAY: 'default', //default, fullscreen, center, modal-center, fill
		LOADING_TEXT: 'loading advertisement',
		PREROLL_ELEM: function(){return document.getElementById('videoad')},
		AIP_COMPLETE: function ()  {
			/*******************
			 ***** WARNING *****
			 *******************
			 Please do not remove the PREROLL_ELEM
			 from the page, it will be hidden automaticly.
			*/
			console.log("Video Ad Completed: " + evt);
		}
	});
});
Show the Rewarded Ad
//check if the adslib is loaded correctly or blocked by adblockers etc.
if (typeof aiptag.adplayer !== 'undefined') {
	aiptag.cmd.player.push(function() { aiptag.adplayer.startRewardedAd(); });
} else {
	//Adlib didnt load this could be due to an adblocker, timeout etc.
	//Please add your script here that starts the content, this usually is the same script as added in AIP_REWARDEDCOMPLETE.
	console.log("Rewarded Ad Could not be loaded, load your content here");
}

Displaying Audio Ads

Show the Audio Ad
//check if the adslib is loaded correctly or blocked by adblockers etc.
if (typeof aiptag.adplayer !== 'undefined') {
	aiptag.cmd.player.push(function() { aiptag.adplayer.startAudioAd(); });
} else {
	//Adlib didnt load this could be due to an adblocker, timeout etc.
	//Please add your script here that starts the content.
	alert("Audio Ad Could not be loaded, load your content here");
}

Interstitial Ads

Knowing when an interstitial ad is available

The following event will be triggered when there is an interstitial ad available Please make sure this Event Listener is set before the JavaScript snippet: //api.adinplay.com/libs/aiptag/pub/XXXXX/tag.min.js is loaded
//Interstitial ad available event
document.addEventListener("aip_interstitialadavailable", function(e) {
	console.log("An interstitial ad is available");
});

Disabling Interstitial Ads

Add the following setting to the initialisation just after var aiptag = aiptag || {}; Please make sure this setting is set before the JavaScript snippet: //api.adinplay.com/libs/aiptag/pub/XXXXX/tag.min.js is loaded interstitial ads will need to be enabled, please contact our team to enable Interstitial Ads
// disable interstitial ads
aiptag.disableInterstitialAd = true;

COPPA

You can mark your ad requests to be treated as child-directed. The feature is designed to help facilitate compliance with the Children's Online Privacy Protection Act (COPPA). Note that you may have other legal obligations under COPPA. Please review the FTC’s guidance and consult with your own legal counsel.
When using this feature, a TFCD (Tag for Child Directed Treatment) parameter will be included in your ad request. The parameter functions to either disable or allow interest-based advertising and remarketing ads for that content.
// mark ad requests to be treated as child-directed
aiptag.COPPA = true;

CMP tool settings for capturing user GDPR consent

aiptag.cmp = {
	show: true,
	position: "centered",  //centered or bottom
	button: true,
	buttonText: "Privacy settings",
	buttonPosition: "bottom-left" //bottom-left, bottom-right, top-left, top-right
}

If you choose not to use the Consent tool button its important to implement aipAPItag.showCMPScreen(); as described below. To comply with the GDPR to show the Consent tool settings menu to revoke or change your consent settings.

<a href="javascript:void(0)" onclick="aipAPItag.showCMPScreen()">Privacy settings</a>
You can use the following functions to show or hide the settings button. (this can be useful when in game for example.)
aipAPItag.hideCMPButton();
aipAPItag.showCMPButton();
Add the following querystring to your site to test the GDPR outside the EU.
http://www.yousite.com/?cmpscreen&cmpregulationkey=GDPR

The CMP can call the following events

Event

Description

"aip_consentnotrequired"

No consent required, consent tool is not loaded.

"aip_consentinit"

CMP code is loaded and the stub code has been removed. At this stage the CMP has no information about the consent yet.

"aip_consentsettings"

CMP finished loading its settings. If a consent string existed already, the consent data can now be read from the CMP.

"aip_consentscreen"

CMP shows the consent screen

"aip_consentscreenoff"

CMP removes the consent screen

"aip_consent"

CMP has gathered consent or a preexisting cookie was found. Consent data can now be read from the CMP.

"aip_consentapproved"

Visitor gave positive consent to all vendors/purposes

"aip_consentrejected"

Visitor rejected all vendors and purposes

"aip_consentliestablished"

Consent screen is shown, legitimate interest has been established for this visitor.

Examples

//CMP shows the consent screen
document.addEventListener("aip_consentscreen", function(e) {
	console.log("CMP shows the consent screen");
});

//CMP removes the consent screen
document.addEventListener("aip_consentscreenoff", function(e) {
	console.log("CMP removes the consent screen");
});

Manually opening / resurfaceing the consent layer

If you want the consent layer to show up (even for users that already gave consent), you can do so by simply loading the page with the parameter (?cmpscreen). For example: https://adinplay.com/?cmpscreen will force the consent screen to show.