Overview

Playwire Banner Advertising unlocks revenue potential for your sites and helps you maximize your earning potential with our cutting-edge header bidding integration. We make the process of adding banner advertising to your site seamless and efficient. Follow the steps below to get started:

1

Current Implementation:

If you are new to header bidding with Playwire, skip to Step 3; For current header bidding publishers, you will need to remove any old code you may have on your page from our previous header bidding solution as well as any old ad tag implementation. There may be multiple places the old code may still be present on: homepage template, run-of-site templates and both desktop and mobile templates.
  • Contact your Playwire Account Manager if you have any questions about your current implementation
  • Identify which ad placements are currently on your site
  • Typically the placements might be: 728×90 Leaderboard above the fold and below the fold, 320×250 Medium Rectangle above the fold and below the fold
2

Remove Old Code:

  • In the <head> of your document, you will need to remove any old scripts linking to tyche.js or DAS.js, example below:
    	<!DOCTYPE html>
    	<html>
    
    	<head>
    		<script src="http://cdn.intergi.com/utils/ads.js"></script>
    		<script src="http://cdn.intergi.com/utils/tyche.js"></script>
    		<script src="http://aka-cdn-ns.adtechus.com/dt/common/DAC.js"></script>
    	</head>
    
    	<body>
    	</body>
    	</html>
    	
  • You will need to also remove code snippets of the actual ad tags within the body of your document
  • They usually contain a <div> with an id of your placement a <noscript> tag and a <script> containing ADTECH config and loadAd or a document.write scripts:
  • Old ADTECH.loadAd( ) Ad Tags:
    	<div id="1234567">
    		<noscript>
    			<a href="http://ads.intergi.com/adlink|3.0|5205.1|1234567|0|225|ADTECH;">
    				<img src="http://ads.intergi.com/adserv|3.0|5205.1|1234567|0|225|ADTECH;">
    			</a>
    		</noscript>
    	</div>
    
    	<script>
    	ADTECH.config.page = { protocol: 'http', server: 'ad.com', network: '123', pageid: 0, params: { loc: '100' }};
    	ADTECH.config.placements[ 1234567 ] = { sizeid: 225, params: { alias: '', target: '_blank' } };
    	ADTECH.loadAd( 1234567 );
    	</script>
    	
    Older document.write Ad Tags:
    	<!--JavaScript Tag // Tag for network 5205: Playwire // Website: mywebsite-1234556 //
    	Page: mysite.com // Placement: mysite.com |display|desktop|ROS|atf|728x90|dd|123456|W (123456) -->
    	<script language="javascript">
    	  document.write('<scr'+'ipt language="javascript1.1" src="http://ads.intergi.com/addyn/3.0/5205/123456/0/123/ADTECH;misc='+new Date().getTime()+'"></scri'+'pt>');
    	</script>
    
    	<noscript>
    	  <a href="http://ads.intergi.com/adlink/3.0/5205/123456/0/123/ADTECH;">
    		<img src="http://ads.intergi.com/adserv/3.0/5205/123456/0/123/ADTECH;"/>
    	  </a>
    	</noscript>
    	<!-- End of JavaScript Tag -->
    	
  • You will also need remove any 1×1 skin ad tags, the header bidding script will take care of any site skin and takeovers
  • You can leave any 2×1 In-Image Display Ads and 2×2 Reveal/In-Read Video Ad Units
  • Once you are absolutely sure there is no old code on your site, you are ready to move to the next step
3

Implementing the New Ad Tags:

You will receive an onboarding kit, specific to your account and website. Within the kit, you will find a code snippet containing 2 scripts to include in the <head> of the document and ad tags to be placed in the <body> of the document.
  • Within your on-boarding kit, find the section labeled Head Scripts, copy the code to your clipboard
  • Place the copied code right after the opening <head> tag of your HTML document. Make sure to use your custom code, DO NOT use the code below:
    	<!DOCTYPE html>
    	<html>
    
    	<head>
    	<!-- Place scripts as close to opening <head> tag as possible -->
    	<script type="text/javascript">
    	  var tyche = { mode: 'tyche', config: '//config.playwire.com/1006036/v2/websites/52704/banner.json' };
    	</script>
     
    	<script id="tyche" src="//cdn.intergi.com/hera/tyche.js" type="text/javascript"></script>
    
    	</head>
    
    	<body>
    
    	<!-- 728 x 90 ATF Desktop -->
    	<div data-pw-desk="leaderboard_atf"></div>
    	<!-- 320 x 50 ATF Mobile -->
    	<div data-pw-mobi="leaderboard_atf"></div>
    
    	<!-- 728 x 90 BTF Desktop -->
    	<div data-pw-desk="leaderboard_btf"></div>
    	<!-- 320 x 50 BTF Mobile Adhesion Unit -->
    	<div data-fixed="true" data-pw-mobi="leaderboard_btf"></div>	
    
    	<!-- 300 x 250 ATF Desktop -->
    	<div data-pw-desk="med_rect_atf"></div>
    	<!-- 300 x 250 ATF Mobile -->
    	<div data-pw-mobi="med_rect_atf"></div>
    
    	<!-- 300 x 250 BTF2 Desktop -->
    	<div data-pw-desk="med_rect_btf"></div>
    	<!-- 300 x 250 BTF2 Mobile -->
    	<div data-pw-mobi="med_rect_btf"></div>
    
    	</body>
    	</html>
    	
  • To differentiate between desktop and mobile placements, the embed will denote whether its for desktop: “data-pw-desk” or mobile: “data-pw-mobi”
  • For example, the desktop 300×250 above the fold placement would look like this <div data-pw-desk=’med_rect_atf’></div>
  • Paste both the desktop and mobile* ad tags in their correct place
  • By default, we automatically detect desktop and mobile* devices and serve the appropriate placement based on the device – but we also offer a way to override the automatic detection using a setting in the head script isMobile: ‘auto | true | false’
  • For example, if your site is NOT mobile optimized, you can force all placements to load desktop only by adding the isMobile: ‘false’ setting to your head script
    
    	<script type="text/javascript">
    	  var tyche = { 
    	  				mode: 'tyche', 
    	  				config: '//config.playwire.com/1006036/v2/websites/52704/banner.json',
    	  				isMobile: 'false' 
    	  			};
    	</script>
    	
    *Mobile Placements
    You can place both desktop and mobile placements on your page. Our script will automatically detect which device the user is on. However, if your site utilizes a separate mobile template view for your site, for example if your m.site.com will only serve a mobile optimized experience, you can use separate desktop and mobile ad tags for each experience.
4

Live Header Bidding Demo:

Code Example

<!DOCTYPE html>
<html>
<head>

<!-- Place scripts as close to opening <head> tag as possible -->
<script type="text/javascript">
var tyche = { mode: 'tyche', config: '//config.playwire.com/1006036/v2/websites/52704/banner.json' };
</script>

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

</head>

<body>

<!-- 728 x 90 ATF Desktop -->
<div data-pw-desk='leaderboard_atf'></div>
<!-- 320 x 50 ATF Mobile -->
<div data-pw-mobi='leaderboard_atf'></div>

<section class="content">

	<h2>ARTICLE CONTENT</h2>

	<p>Bacon ipsum dolor amet jerky filet mignon short loin tenderloin. Bresaola pork loin frankfurter beef ribs boudin doner chuck meatball flank tri-tip landjaeger. Spare ribs ham hamburger tongue prosciutto ball tip cow jowl meatloaf tail salami. Capicola bacon porchetta doner, flank pork belly jowl corned beef kielbasa shoulder.</p>

	<p>Drumstick short loin flank chuck biltong ground round. Doner kielbasa pig turducken hamburger, ham hock drumstick cow pancetta frankfurter pork. Meatball salami ham hock meatloaf spare ribs andouille drumstick tongue jowl capicola bacon fatback strip steak chuck. Beef ribs shankle ham hock turducken. Sirloin strip steak tongue, biltong filet mignon picanha tail pig corned beef landjaeger. Andouille prosciutto chicken porchetta ham. Shank pork loin chicken, pancetta ribeye frankfurter pork chop shoulder capicola landjaeger meatloaf chuck t-bone.</p>

	<p>Picanha ham ham hock, jerky burgdoggen swine alcatra t-bone fatback cow ground round ball tip tri-tip pork. Pig doner turducken, capicola short loin turkey tenderloin pastrami. Chicken t-bone ball tip swine, spare ribs rump bacon pancetta. Chicken pork chop pastrami, pork belly hamburger pork picanha jowl sirloin frankfurter fatback turkey.</p>

	<!-- 728 x 90 BTF Desktop -->
	<div data-pw-desk="leaderboard_btf"></div>
	<!-- 320 x 50 BTF Mobile Adhesion Unit -->
	<div data-fixed="true" data-pw-mobi="leaderboard_btf"></div>

</section>

<section class="sidebar">

	<!-- 300 x 250 ATF Desktop -->
	<div data-pw-desk="med_rect_atf"></div>
	<!-- 300 x 250 ATF Mobile -->
	<div data-pw-mobi="med_rect_atf"></div>

	<img src="http://placehold.it/350x150?text=Sidebar+Image">

	<!-- 300 x 250 BTF Desktop -->
	<div data-pw-desk="med_rect_btf"></div>
	<!-- 300 x 250 BTF Mobile -->
	<div data-pw-mobi="med_rect_btf"></div>

	<img src="http://placehold.it/350x150?text=Sidebar+Image">

	<!-- 300 x 250 BTF2 Desktop -->
	<div data-pw-desk="med_rect_btf"></div>
	<!-- 300 x 250 BTF2 Mobile -->
	<div data-pw-mobi="med_rect_btf"></div>

</section>

</body>
</html>

Live Demo -or- view standalone example
  • Was this Support Article Helpful ?
  • yes   no