Responsive Design and DFP

Douglas Taylor

Active member
I've searched, but haven't seen anything specific to DFP (Doubleclick for Publishers) and variable ad sizes for Responsive design.

Has anyone found anything specific to DFP?

Thanks!
 

Douglas Taylor

Active member
As always, thanks a billion for your speedy help. DFP seems to work just a little bit different so I'll explore and see what I come up and share with the community.
 

Hoolio

Active member
How are you getting on?
I am interested to add DFP and would want it to adapt to screen size..
 

kontrabass

Well-known member
Sharing how I got Google DFP to show responsive ads:

For reference: https://support.google.com/dfp_premium/answer/3423562?hl=en#

My code for just before ending </head> tag in PAGE CONTAINER:

Code:
<xen:comment>  BEGIN DFP HEADER </xen:comment>
<script type='text/javascript'>
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
(function() {
var gads = document.createElement('script');
gads.async = true;
gads.type = 'text/javascript';
var useSSL = 'https:' == document.location.protocol;
gads.src = (useSSL ? 'https:' : 'http:') +
'//www.googletagservices.com/tag/js/gpt.js';
var node = document.getElementsByTagName('script')[0];
node.parentNode.insertBefore(gads, node);
})();
</script>

<script type='text/javascript'>
googletag.cmd.push(function() {
var mapping = googletag.sizeMapping().
addSize([1500,900], [970, 90]).
addSize([600, 600], [728, 90]).
addSize([500, 500], [320, 50]).
build();
googletag.defineSlot('/xxxxxx/Leader_Responsive_Test2', [320, 50], 'div-gpt-ad-13893xxxxxxxxxx-0').
defineSizeMapping(mapping).
addService(googletag.pubads());
googletag.enableServices();
});
</script>
 

Douglas Taylor

Active member
Yes! Works like a charm!

Have you had any luck trying to show two different responsive ads on the same page?
Solved it. I simply wasn't defining the zone properly in order to show two different ads:

Code:
<xen:comment>  BEGIN DFP HEADER </xen:comment>
<script type='text/javascript'>
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
(function() {
var gads = document.createElement('script');
gads.async = true;
gads.type = 'text/javascript';
var useSSL = 'https:' == document.location.protocol;
gads.src = (useSSL ? 'https:' : 'http:') +
'//www.googletagservices.com/tag/js/gpt.js';
var node = document.getElementsByTagName('script')[0];
node.parentNode.insertBefore(gads, node);
})();
</script>

<script type='text/javascript'>
googletag.cmd.push(function() {
var mapping = googletag.sizeMapping().
addSize([1500,900], [728, 90]).
addSize([600, 600], [468, 60]).
addSize([500, 500], [320, 50]).
build();
googletag.defineSlot('/1009XXX/Content_Top', [320, 50], 'div-gpt-ad-YOURCODE-0').
defineSizeMapping(mapping).
addService(googletag.pubads());
googletag.enableServices();
googletag.defineSlot('/1009XXX/Content_Bottom', [320, 50], 'div-gpt-ad-YOUROTHERCODE-0').
defineSizeMapping(mapping).
addService(googletag.pubads());
googletag.enableServices();
});
</script>
 
Top