How can I set a key value at the impression level in Google AdManager/DFP? - google-dfp

I'm working on a script that will refresh ads after 30 seconds of engaged on screen time. What I'd like to do is track in AdManager how these refreshed ads perform and how much they are adding to my bottom line.
I'd like to set up a key value like "reloaded" that has a true of false value indicating whether that impression was an initial load of the ad unit or a refreshed load after 30 seconds of engaged time.
I can't seem to figure out how to do this. It looks like you only have the option of setting key values at the page or ad unit level, not the impression. Anyone know how to achieve this?
Thanks!

You are able to add a key and an attached value to a specific slot before refreshing it. Then, you can use it after the slot refreshed. Below is the demonstration :
Step 1 : Page setup
<script async='async' src='https://www.googletagservices.com/tag/js/gpt.js'></script>
<script>
var googletag = googletag || {};
googletag.cmd = googletag.cmd || [];
</script>
<script>
var slots = {}
googletag.cmd.push(function() {
slots['banner'] = googletag.defineSlot('/adpath', [[728, 90]], 'banner').addService(googletag.pubads()).setTargeting('key1', 'value1');
googletag.pubads().enableSingleRequest();
googletag.pubads().setCentering(true);
googletag.pubads().collapseEmptyDivs(true);
googletag.enableServices();
});
</script>
<div id='banner'>
<script>
googletag.cmd.push(function() {
googletag.display('banner');
});
</script>
</div>
Step 2 : Check the attached key to the slot
//in your console
slots['banner'].getTargetingKeys()
//should log >> Array [ "key1" ]
Step 3 : add a new key in js
<script>
slots['banner'].setTargeting('reloaded','true')
</script>
Step 4 : reload the slot
<script>
googletag.pubads().refresh(slots[0])
</script>
Step 5 : Check the attached key to the slot
//in your console
slots['banner'].getTargetingKeys()
//should log >> Array [ "key1", "reloaded" ]
With this set up, you are able to identify / target the "reloaded = true" inventory within your Google Ad Manager interface.
Related documentation :
GPT setTargeting
GPT getTargetingKeys
GPT refresh
Hope this helps.

Related

Google Analytics 4 (gtag js) 'set' command not adding data to events

I'm trying to add data to each event I send in GA4 via javascript by using the 'set' command:
https://developers.google.com/tag-platform/gtagjs/reference#set
From those docs, it appears to be similar to Serilog Enrichment, but it doesn't appear to work and I don't see this data coming through.
I'm using localhost + Google Analytics Debugger chrome extension. Then in the Analytics > Configure > DebugView I see the custom event 'hello-world' and the property 'test', but I don't see the data I add via the "set" command.
GA DebugView
I use the set command for 2 calls - first is the "user_id" property that does work. That must be a special case, since GA treats that differently. The 2nd is for the custom object that doesn't work.
Console shows some output for both set command calls, but nothing to tell me that something has succeeded or failed
<!DOCTYPE html>
<html>
<head>
<!-- Global site tag (gtag.js) - Google Analytics -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-SOMECODE"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
window.dataLayer.push(arguments);
}
gtag('js', new Date());
// Set enrichment properties for every event "on this page"
// https://developers.google.com/tag-platform/gtagjs/reference#set
gtag('set', {
'foo': 'bar',
});
// Set the measurement id
// https://developers.google.com/analytics/devguides/collection/gtagjs/setting-values
gtag('config', 'G-SOMECODE');
//Set the GA4 user_id and keep it set for all events
gtag('set', {
'user_id': 'a24b935c-03cd-47f0-af68-c60a68b31303'
});
gtag('event', 'hello-world', {
'test': true
});
</script>
<title>Html Delivery</title>
<script type="text/javascript">
function myFunction() {
// Event with nested data test. It doesnt seem to display nicely
gtag('event', 'button-click-nested', {
'data': {
'type': 'nextButton'
}
});
gtag('event', 'button-click', {
'type': 'nextButton'
});
}
function LinkFunction() {
console.log("link click");
gtag('event', 'link click', {
'type': 'link'
});
}
</script>
</head>
<body>
<button onclick="myFunction()">Next</button>
<a id="myLink" href="#" title="Click to do something" onclick="LinkFunction()">link text</a>
</body>
</html>
I've tried to move the calls to above/below the config command, but it makes no difference either.
There is a similar question, but my rep wont let me comment on it to see if its still the case. The accepted answer doesn't really help me since I wanted to be able to add any arbitrary data in this way.
I have tried to setup a custom metric for this in GA (im not using GTM), but still. No data comes through.
Does this just not work?

Interval role i-lines are not displayed in Google line chart

I am trying to add min and max limits to a Google chart, which I generate using a Perl script from CSV data - by using the interval role for these 2 values.
Unfortunately the I-lines are not displayed at my line chart, even though I've set the min and max limits to the -100 and 100 for the sake of testing.
Only the main data is being displayed:
Can anybody please spot the error, what is wrong with my very simple test case?
Please just save the code below as an HTML-file and open in a browser:
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="https://www.google.com/jsapi?autoload={'modules':[{'name':'visualization','version':'1','packages':['corechart']}]}"></script>
<script type="text/javascript">
var data = {"L_B8_ACLR_50_0_QPSK_1_H":{"rows":[
{"c":[{"v":"UTRA_1_DOWN"},{"v":-100},{"v":100},{"v":"-42.46912"}]},
{"c":[{"v":"E-UTRA_1_DOWN"},{"v":-100},{"v":100},{"v":"-39.9545"}]},
{"c":[{"v":"E-UTRA_1_UP"},{"v":-100},{"v":100},{"v":"-48.68408"}]},
{"c":[{"v":"UTRA_1_UP"},{"v":-100},{"v":100},{"v":"-49.45148"}]},
{"c":[{"v":"UTRA_2_UP"},{"v":-100},{"v":100},{"v":"-58.96674"}]}],
"cols":[
{"p":{"role":"domain"},"label":"MEASUREMENT","type":"string"},
{"p":{"role":"interval"},"label":"LSL","type":"number"},
{"p":{"role":"interval"},"label":"USL","type":"number"},
{"p":{"role":"data"},"label":"1142926087","type":"number"}]}};
function drawCharts() {
for (var csv in data) {
var x = new google.visualization.DataTable(data[csv]);
var options = {
title: csv,
width: 800,
height: 600
};
var chart = new google.visualization.LineChart(document.getElementById(csv));
chart.draw(x, options);
}
}
$(function() {
google.setOnLoadCallback(drawCharts);
});
</script>
</head>
<body>
<div id="L_B8_ACLR_50_0_QPSK_1_H"></div>
</body>
</html>
(I don't want to use methods like addColumn or addRows. Instead I prepare my data as data structure in my Perl script and then JSON-encode and pass it to DataTable ctr).
You must specify the interval-role column after the data-column. As written in the API :
"All columns except domain columns apply to the nearest left neighbor to which it can be applied"
So if you change the order (and here with some smaller intervals)
var data = {"L_B8_ACLR_50_0_QPSK_1_H":{"rows":[
{"c":[{"v":"UTRA_1_DOWN"},{"v":"-42.46912"},{"v":-50},{"v":-45}]},
{"c":[{"v":"E-UTRA_1_DOWN"},{"v":"-39.9545"},{"v":-50},{"v":-45}]},
{"c":[{"v":"E-UTRA_1_UP"},{"v":"-48.68408"},{"v":-50},{"v":-45}]},
{"c":[{"v":"UTRA_1_UP"},{"v":"-49.45148"},{"v":-50},{"v":-45}]},
{"c":[{"v":"UTRA_2_UP"},{"v":"-58.96674"},{"v":-50},{"v":-45}]}],
"cols":[
{"p":{"role":"domain"},"label":"MEASUREMENT","type":"string"},
{"p":{"role":"data"},"label":"1142926087","type":"number"},
{"p":{"role":"interval"},"label":"LSL","type":"number"},
{"p":{"role":"interval"},"label":"USL","type":"number"}
]}};
..You end up with :

DFP: Getting the current click-through URL

I am setting up a DFP for multiple site, we have a set of line items and for each of it's creatives, the current click through is going to example.com (our own .com site), but since we are running multiple TLDs, we also want the click through URL to change accordingly. For example, when the ads is being displayed in the .jp, the click through should go to .jp.
In the DFP API reference, there's a function to change the click-through URL: http://support.google.com/dfp_premium/bin/answer.py?hl=en&answer=1650154&expand=adslot_details#setClickUrl
But in order to change our click-through URL, we also need to know what's the current URL. Example case: we need to get http://www.example.com/products/1 from the DFP adSlot in order to change it to http://www.example.jp/products/1.
I ran through trial and error using chrome web JS console and found a getClickUrl() function in the adSlot class, but it keeps returning empty string, for example:
googletag.defineSlot("/1234/Test_300x250", [300, 250], 'div-1').getClickUrl();
googletag.defineSlot("/1234/Test_300x250", [300, 250], 'div-1').addService(googletag.pubads()).getClickUrl();
Anyone have experience with this?
If you have control over the creative, I think it would be a lot easier to do by passing custom variables. You use the setTargeting method to pass a custom variable. So your client-side code to display the ad would look like this:
googletag.defineSlot("/1234/Test_300x250", [300, 250], 'div-1').setTargeting('region','jp');
And then in your HTML creative you use a pattern macro to replace part of the click-through URL.
<a href="http://www.example.%%PATTERN:region%%">
<img src="http://www.example.%%PATTERN:region%%/image.jpeg">
</a>
And DFP will replace the macro with whatever value you pass via setTargeting.
I haven't found a super simple way to do this - but it is possible.
Basically you can override an internal function in DFP and capture the content of the ad (and the URL) by getting into the DOM of the iframe.
Here is an example which should alert the URL of the ad (I've only tested this in chrome, so it may need tweaking to work in multiple browsers)
<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_300x250', [300, 250], 'div-gpt-ad-1340819095858-0').addService(googletag.pubads());
slot1.oldRenderEnded = slot1.renderEnded;
slot1.renderEnded = function(){
alert(document.getElementById('div-gpt-ad-1340819095858-0').getElementsByTagName('iframe')[0].contentWindow.document.getElementsByTagName('a')[0].href.replace(/^.*&adurl=/,''));
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>
If you are using jQuery its a bit nicer to use something like:
$(adUnit).find('iframe:first').contents().find('a')
Any questions let me know.

Fc_Chartupdated Is Not Called at Hlinear Guage Update

I am trying to display and update HLINEAR GAUGE fusionGadget pointer value. When I am dragging the pointer , the function FC_ChartUpdated is not being called. I have tried using RealtimeUpdateComplete eventListener too. But it displays error 'Object does not support property / method 'setAttribute''..Can you please tell me the reason?
We have to call that JS function or It will be called automatically when Gauge is updated?
Here is my code,
<html>
<head>
<title>FusionGadgets</title>
<script language="JavaScript" src="FusionCharts.js"></script>
</head>
<body bgcolor="#ffffff">
<div id="chartdiv" align="center">FusionGadgets</div>
<script type="text/javascript">
var myChart = new FusionCharts("HLinearGauge.swf", "myChartId", "450", "120", "0", "0");
myChart.setDataURL("Data.xml");
myChart.render("chartdiv");
</script>
</body>
<script>
FusionCharts("myChartId").addEventListener("RealtimeUpdateComplete" , myChartListener);
function myChartListener(){
alert('Hi.');
}
function FC_Rendered(DOMId)
{ //alert(Math.round(pointerValue));
//Check if DOMId is that of the chart we want
if (DOMId=="myChartId"){
//Get reference to the chart
var chartRef = FusionCharts(DOMId);
//Get the current value
var pointerValue = chartRef.getData(1);
//You can also use getDataForId method as commented below, to get the pointer value.
//var pointerValue = chartRef.getDataForId("CS");
//Update display
alert(Math.round(pointerValue));
}
}
</script>
</html>
Finally,After had been working for several hours,this issue has been resolved.These are the steps which made the issue was resolved...
1.passing registerWithJs value '1'.
var myChart1 = new FusionCharts("HLinearGauge.swf", "myChartId1", "450", "105", "0", "1");
2.Changed Flash Player Global Security Settings..
for more info
3. Chang the FusionCharts.js file to new version.
4.After had made these changes,I encountered with new issue,
chartRef.getData(1) gives javascript error (Object does not support the property/method).
So then I changed the code for getting chart reference
to
var chartRef = getChartFromId(DOMId);
from
var chartRef = FusionCharts(DOMId);

How to refresh `ajax` node on click?

There are some nodes that get data from AJAX call in my jsTree.
How can I refresh the data and NOT by reloading the whole tree?
the best would be simple click on the node I wish to refresh
context menu is ok too
How about this?
<html>
<head>
<script language="javascript" type="text/javascript" src="jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="jquery.jstree.js"></script>
<script>
var treeConfig = {
"json_data" : {
"data" : [{
"data" : "Root",
"state" : "closed",
"children" : ""
}],
"ajax" : {
"url" : "http://localhost/tree.json",
"data" : function (node) {
return { query : "Value" };
}
}
},
"plugins" : [ "themes", "json_data", "ui" ],
};
$(document).ready(function(){
$("#treeContainer").jstree(treeConfig);
$('#treeContainer a').live('click',function(){
var tree = jQuery.jstree._reference("#treeContainer");
var currentNode = tree._get_node(null, false);
tree.refresh(currentNode);
});
});
</script>
</head>
<body>
<div id="treeContainer"></div>
</body>
</html>
Here's what I'm doing:
using the JSON data plugin (but the concept is similar for HTML and XML plugins)
loading the initial tree node ("Root") from the data config object
setting the AJAX config object so all other nodes request their child data via ajax, when initially opened (applies to any node where 'state' is 'closed' and 'children' is 'empty')
using the AJAX data function to pass the correct query string to get relevant data for the node being opened. My example always fetches http://localhost/tree.json?query=Value but you probably want to do something like set Value to the node id so the server sends back relevant data.
So far this makes an ajax request for the node data only the first time the node is opened. The final step is:
create a click function which causes a single node to refresh its data every time it is clicked