How to create responsive passback in Google Ad manager?

Everyone know how to build responsive ads using ‘Sizemapping’ function on GPT tags. Plenty of help articles are available for responsive GPT tags but no instruction available on the Google help center for creating the responsive ‘Passback” tags.

Responsive passback tags render creative based on the page width/browser width/device width. For example user if the user need to use multi-size passback it won’t render based on the screenwidth. This is one of the limitation for the publishers.

What is Passback?

From beginning, we are discussing about the passback. If you are a newbie, the passback is a complex word to understand. In layman terms passback is just back up ads. Passback is a standalone JavaScript, publisher can use that as back up ad when no ad is available on the ad network end.

For better user experience, ad should deliver on appropriate viewport. That is why we need responsive design tags.

Do I need coding knowledge?

No, I’m going to add the sample code below, where you can replace your network ID , ad unit code and size which you required based on your device (Desktop, Tablet, and mobile).

<script src='https://www.googletagservices.com/tag/js/gpt.js'></script>
<script>

var screenwidth = window.parent.window.innerWidth || 
           window.parent.document.documentElement.clientWidth ||
           window.parent.document.body.clientWidth;

if (screenwidth > 1024) { //Desktop
		   googletag.pubads().definePassback('/12345/AdunitCode', [[970,90]])
                    .setTargeting('Test_Mode', ['ON'])
                    .display();}
		   
		   else if (screenwidth < 1024 && screenwidth > 768) // Tablet
		   {
		   googletag.pubads().definePassback('/12345/AdunitCode', [[728,90]])
                    .setTargeting('Test_Mode', ['ON'])
                    .display();}
		   
		   else if (screenwidth < 768 && screenwidth > 200) //Mobile
		   {
		   googletag.pubads().definePassback('/12345/AdunitCode', [[320,100]])
                    .setTargeting('Test_Mode', ['ON'])
                    .display();}
  console.log(screenwidth);

</script>

Remove “.setTargeting(‘Test_Mode’, [‘ON’])” from the above tag sample if you not using any custom targeting.

Do you want to see working example?. See below

Please send me the feedback.

Thank you!!!!!