J'utilise actuellement des balises Google Publisher avec DFP pour servir des annonces sur un site qui sera très bientôt réactif. Nous avons une fente d'annonce particulière qui peut potentiellement servir 2 largeurs potentielles, 728 ou 960 et selon laquelle la largeur est servie que je souhaite soit rendre la publicité au-dessus ou au-dessous de la valeur liquidative.
La première question évidente est-elle si elle est même sain d'esprit à distance et que c'est possible? Je soupçonne que je devrais probablement définir deux emplacements annonces distincts.
La question principale cependant qui est probablement plus universitaire est de savoir comment puis-je détecter les dimensions d'une annonce qui a été servie? Je soupçonne que la solution est agnostique sur la plate-forme d'annonce depuis que je suis fondamentalement détecté l'insertion de noeud, puis inspectant les dimensions de l'élément de conteneur.
J'ai expérimenté l'événement JavaScript DomnodeInservé, mais il semble déclencher pour tout "mais" les annonces. Je suis confus par cela à moins que GPT insère les annonces d'une manière qui ne déclenche pas cet événement.
4 Réponses :
J'ai eu un problème similaire sur Wiimusic.net avec Google Adsense. Ce que j'ai fini par faire était de détecter la taille de la div contenant l'annonce avec JavaScript puis chargé l'annonce. Dans cette situation, il n'était pas possible de modifier la résolution ou la taille de ma page une fois chargé, de sorte que cela a fonctionné.
Dans votre situation, votre page peut certainement changer de taille et ce qui n'est pas. Je pense que vous devrez ré-charger les annonces à ce stade, si vous souhaitez que différentes versions publicitaires soient visibles en fonction de votre conception réactive. Si vous utilisez le code d'annonce asynchrone, cela devrait être possible.
Pour résumer, oui, c'est sain d'esprit et possible avec JavaScript. Vos annonces nécessitent que JavaScript fonctionne de toute façon, cela ne devrait donc pas être une grande barrière.
Dans ma situation, je dois effectivement faire l'inverse de cela. Je vais régler la taille / la position de la DIV contenant en fonction de la taille de l'annonce desservie pas l'inverse. Afin de faire cela, je dois trouver un moyen de définir un rappel lorsque l'annonce est insérée. Comme je l'ai dit, j'ai essayé l'événement DomnodeInservé et que j'essaye aussi de DomsubTheMified pour détecter lorsque le contenu de l'annonce est inséré.
@sphoid, pardonne mon ignorance, mais je pensais que les machines à sous Annd DFP ne pouvaient contenir qu'une seule taille? Comment DFP détermine-t-elle quelle taille d'annonce pour vous servir? Vous avez dimensionné votre page différemment selon la taille de la taille où vous recevez? Je pense que la question DomnodeInservée est due à l'IFrame dans lequel la publicité est servie.
Vous pouvez définir plusieurs tailles annonces séparées par des virgules pour une fente à googletag.definesLot (). Je le fais principalement pour la fente d'annonces de classement qui peut servir des bannières pleine largeur de page ainsi que des bannières centrées plus étroites. Certaines de mes annonces n'insirent pas les iframes, elles génèrent plutôt une div de manière dynamique et insérent des balises de script et parfois des étiquettes d'objet si la création est basée sur Flash. Je devrais pouvoir détecter lorsque ces éléments sont insérés au moins.
Donc, comme d'habitude, je pensais que cela en pensait. La raison pour laquelle je ne détectais pas un changement de DOM est parce que l'annonce avait déjà été insérée au moment où je cédais des gestionnaires d'événements. Lorsque vous chargez des annonces de manière synchrone, je peux mesurer immédiatement les dimensions du conteneur div et obtenir les dimensions de l'annonce. Lorsque vous chargez de manière asynchrone, je suis capable de sonder pour les modifications internes HTML en stockant le code HTML d'origine en utilisant et interrogateur pour les modifications et en faisant la mesure du conteneur DIV lorsque le changement se produit. Merci Brad pour votre temps.
J'ai parlé trop tôt. Cette solution ne fonctionne que dans des situations où le conteneur div peut et redimensionnera lorsque la création le garantit. J'ai un scénario où le conteneur div ne peut redimensionner afin que la création soit brisée horizontalement, ce qui est le problème même que j'essaie d'éviter. Je suppose que j'ai besoin d'une manière légitime pour détecter les dimensions de la création.
J'ai fait quelque chose comme ça avant ... et la méthode que j'ai installée sur une fonction DFP interne (rendue) afin de pouvoir voir ce que l'annonce était au point qu'il avait rendu à l'écran ...
Par exemple, pour obtenir les dimensions de la publicité, vous pouvez faire quelque chose comme ce qui suit (je n'ai testé que ceci en chrome, mais il ne faut pas être trop loin d'être complètement croisé): P>
<html>
<head>
<title>DFP test</title>
<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 slot1 = googletag.defineSlot('/12345678/TEST', [266, 115], 'div-gpt-ad-1340819095858-0').addService(googletag.pubads());
slot1.oldRenderEnded = slot1.renderEnded;
slot1.renderEnded = function(){
window.console.log('width: '+document.getElementById('div-gpt-ad-1340819095858-0').getElementsByTagName('iframe')[0].contentWindow.document.width);
window.console.log('height: '+document.getElementById('div-gpt-ad-1340819095858-0').getElementsByTagName('iframe')[0].contentWindow.document.height);
slot1.oldRenderEnded();
};
googletag.pubads().enableSingleRequest();
googletag.enableServices();
});
</script>
</head>
<body>
<div id='div-gpt-ad-1340819095858-0' style='width:266px; height:115px;'>
<script type='text/javascript'>
googletag.cmd.push(function() {
googletag.display('div-gpt-ad-1340819095858-0');
});
</script>
</div>
</body>
</html>
C'est en fait la solution la plus proche de ce que je cherche. L'étape suivante consiste à détecter systématiquement la largeur souhaitée de la création rendue à l'intérieur du logement de publicité. Pour nous, la création peut varier entre les iframes, les images et les objets Flash. J'ai trouvé qu'ils ont presque toujours une largeur paramètre que je peux lire. La détection de la largeur rendue semble problématique si le conteneur div est trop petit puisque la créativité est simplement brisée horizontalement.
@Matt Cooper - Où et comment avez-vous découvert la fonction DFP interne rendue? S'il y a d'autres fonctions, je peux remplacer cela serait génial.
@umami je l'ai trouvé juste en regardant dans l'espace de nom Googletag avec l'inspecteur chrome. Si vous allumez l'inspecteur et que vous tapez googletag dans la console, vous verrez l'objet Googletag ... Il y a quelques fonctions là-bas et si vous regardez dans la slot_manager_instance et exploitez-vous dans les différentes annonces, vous trouverez un grand nombre de Autres fonctions ... Un autre repo que j'ai trouvé à une date ultérieure codene l'enregistreur DFP interne et permet de connecter également d'autres fonctions DFP, vous pourriez trouver cela intéressant: Github.com/mcounte/dfp-events
La réponse de Ken ci-dessous est maintenant plus correcte, bien que ce soit la bonne réponse à l'époque - il est également documenté et soutenu, espérons-le, espérons-le, nous ne serons donc pas retirés à l'avenir (alors que les rendus pouvaient être)
Oui @markd Vous êtes correct ... Ma réponse est maintenant obsolète avec les nouvelles modifications apportées à GPT - content qu'ils ont finalement publié une solution solide de faire cela!
Il y a eu une mise à jour de GPT qui permet à cela de se faire de manière plus élégante. L'événement vous dira si une créativité a été renvoyée et si oui les dimensions, ainsi que des informations supplémentaires.
googletag.pubads().addEventListener('slotRenderEnded', function(event) {
console.log('Creative with id: ' + event.creativeId +
' is rendered to slot of size: ' + event.size[0] + 'x' + event.size[1]);
});
et un événement aussi "Taille, indique la taille de la création rendue." support.google.com/dfp_premium/answer/1650154?hl=en
Cela devrait vraiment être la réponse sélectionnée maintenant.