Global Site Tag and Adwords/Analytics - gtag.js

We are using Google Tag Manager on SOME of our sites, but not all. On the others, we are using the Global Site Tag (with UA-), like below:
<!-- Global site tag (gtag.js) - AdWords: 1234567890 --> <script async src="https://www.googletagmanager.com/gtag/js?id=AW-1234567890"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-1234567890');
</script>
HOWEVER, when we look at our Adwords account it says to use this tag (with AW-):
<!-- Global site tag (gtag.js) - AdWords: 1234567890 --> <script async src="https://www.googletagmanager.com/gtag/js?id=AW-1234567890"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-1234567890');
</script>
I've seen some videos and posts saying "if you're using either one of these, that's all you need". Is that true?
I have also seen a post that says you need two tags in it (UA- and AW-), as below:
<!-- Global site tag (gtag.js) - AdWords: 1234567890 --> <script async src="https://www.googletagmanager.com/gtag/js?id=AW-1234567890"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-1234567890');
gtag('config', 'UA-1234567890');
</script>
I'd love to find out which is true, and as a result, which we should be using.
Thank you in advance for your assistance.

The last example you mention is the correct one. Anyway I would put the Google Analytics ID as a parameter as mentioned in the docs:
<script async src="https://www.googletagmanager.com/gtag/js?id=GA-PROPERTY_ID">
</script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'GA-PROPERTY_ID');
gtag('config', 'AW-GOOGLE_CONVERSION_ID');
</script>

Related

Tracking AJAX requests in GAnalytics

I'm trying to figure out how to track AJAX requests on my page with Google Analytics (in this case, we are loading more category results). This is the code I'm adding on my page:
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-xxx"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-XXX');
</script>
I was led to believe that running this after the AJAX requests would do the trick:
ga('set', 'page', this_url);
ga('send', 'pageview', this_url);
However, it doesn't seem to work. How would I do this? On our old setup you just do:
_gaq.push(['_trackPageview', this_url]);
...and this tracks it perfectly.
OK so I figured it out. I was reading this article:
https://www.analyticsmania.com/post/single-page-web-app-with-google-tag-manager/
...and it mentioned about the "push" function:
window.dataLayer.push({
'event': 'Pageview',
'url': this_url
});
Sure enough, adding that in and I now see the extra page view going through to Google Analytics. Hopefully this helps save someone a bit of hassle!

Office.context.mailbox.item return null

I'm using office.js api to get the email and attachments in an outlook add-in and I ran into an issue where the office.js api returns null reference for some emails.
Any idea why this is happening ?
<script type="text/javascript" src="https://appsforoffice.microsoft.com/lib/1.1/hosted/office.js"></script>
<script type="text/javascript">
Office.initialize = function () {
$(document).ready(function () {
var mailbox = Office.context.mailbox
_Item = mailbox.item;
})
}
</script>
This can happen if you don't check the page load status as described in this article: https://dev.office.com/docs/add-ins/develop/loading-the-dom-and-runtime-environment. Could you try using $(document).ready() function to see if that solves the problem?

Google SignIn State

I'm trying to build a Google signin button into my website. I'm trying to avoid using their built-in button. The code below works to sign in a user, but I can't figure out how to make my webpage remember that they're signed in when the user refreshes the page, or leaves the site and comes back.
Using Chrome's developer tools, I can see that there's an entry for https://accounts.google.com under both Local Storage and Session Storage. They seem to more or less contain the same information, including the user's validated token.
What I don't understand is how to get the gapi.auth2.init() function to recognize and use this token. The documentation doesn't seem to cover it.
<html>
<head>
<title>Login Test</title>
<script src="http://code.jquery.com/jquery-2.1.4.js"></script>
<script src="https://apis.google.com/js/platform.js?onload=renderButton" async defer></script>
</head>
<script>
var googleUser = {};
function renderButton() {
gapi.load('auth2', function(){
auth2 = gapi.auth2.init({
client_id: 'MY_CREDENTIALS.apps.googleusercontent.com',
});
attachSignin(document.getElementById('customBtn'));
});
};
function attachSignin(element) {
auth2.attachClickHandler(element, {},
function(googleUser) {
document.getElementById('name').innerText = "Signed in: " +
googleUser.getBasicProfile().getName();
}, function(error) {
alert(JSON.stringify(error, undefined, 2));
}
);
}
</script>
<body>
<div id="gSignInWrapper">
<span class="label">Sign in with:</span>
<input type="button" id="customBtn" value="Google"></input>
</div>
<p id="name"></p>
</body>
</html>
You can use listeners. This is the relevant part:
// Listen for sign-in state changes.
auth2.isSignedIn.listen(signinChanged);
// Listen for changes to current user.
auth2.currentUser.listen(userChanged);
You can also get up to date values by
var isSignedIn = auth2.isSignedIn.get();
var currentUser = auth2.currentUser.get();
To strictly detect returning users only you can do:
var auth2 = gapi.auth2.init(CONFIG);
auth2.then(function() {
// at this point initial authentication is done.
var currentUser = auth2.currentUser.get();
});
When it comes to your code I would do:
auth2 = gapi.auth2.init(CONFIG);
auth2.currentUser.listen(onUserChange);
auth2.attachClickHandler(element, {});
This way all changes in sign-in state are passed to onUserChange (this includes returning users, new sign-ins from attachClickHandler, new sign-ins from different tab).

Googleplus API emails list is undefined

According to the googleplus documentation the there are many fields for the user, one example is emails. But when I make a https://www.googleapis.com/plus/v1/people/me?key=, i don't get back the emails i have defined in my contact section under emails. I tried making them public as well, still no luck.
A couple things:
There is a known issue where the email list will not be returned
You can request an additional scope, userinfo.email to get a user's verified email address
The following example shows how this can be done in JavaScript:
<html>
<script type="text/javascript">
function onSigninCallback(resp){
console.log(resp);
gapi.client.load("oauth2", "v2", function(){
gapi.client.oauth2.tokeninfo(
{'access_token' : resp.access_token}).
execute(function(innerResp){console.log(innerResp.email);});
});
}
</script>
<body>
<span class="g-signin"
data-scope="https://www.googleapis.com/auth/userinfo.email"
data-requestvisibleactions="http://schemas.google.com/AddActivity"
data-clientId="YOUR_CLIENT_ID"
data-callback="onSigninCallback"
data-theme="dark"
data-cookiepolicy="single_host_origin">
</span>
</body>
<script>
/**
* Load the Google+ JavaScript client libraries.
*/
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/auth:plusone.js?onload=startApp';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
</html>
An open issue, "ability to obtain an emails list" exists in the Google+ Platform Issue tracker, feel free to star the issue or add a comment.

Google Plus Signin 'Unknown RPC service: widget-interactive-I0_1370237493291'

Sorry for such a noob question.
I just followed following google plus signin's Step1 to Step4.
https://developers.google.com/+/web/signin/
The signin seemed to succeed, while an error 'Unknown RPC service: widget-interactive-I0_1370237493291' emerged. Here are the console logs on Chrome.
XHR finished loading: "https://plusone.google.com/_/scs/apps-static/_/js/k=oz.connect.en_US.B31L_d…sv=1/d=1/ed=1/am=GA/rs=AItRSTOhxGvE7YZFbwjOy6nLkxCnNjz3og/cb=gapi.loaded_1". signin:15
XHR finished loading: "https://plusone.google.com/_/scs/apps-static/_/js/k=oz.gapi.en.hgKKOofQjvI.…sv=1/d=1/ed=1/am=EQ/rs=AItRSTOeNwU4i5ApX9gPGjnZ0AzovKWmWw/cb=gapi.loaded_0". signin:15
Unknown RPC service: widget-interactive-I0_1370237493291 cb=gapi.loaded_0:71
signed in
I think the error is about something incomplete. I cannot figure out what the exactly the error is and how to get it clear. What am I missing?
Here is the code. The origin is http://localhost:3000
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Gplus</title>
</head>
<body>
<h1>Gplus</h1>
<span id="signinButton">
<span
class="g-signin"
data-callback="signinCallback"
data-clientid="362449793624.apps.googleusercontent.com"
data-cookiepolicy="single_host_origin"
data-requestvisibleactions="http://schemas.google.com/AddActivity"
data-scope="https://www.googleapis.com/auth/plus.login">
</span>
</span>
<script type="text/javascript">
function signinCallback(authResult) {
if (authResult['access_token']) {
// Successfully authorized
// Hide the sign-in button now that the user is authorized, for example:
document.getElementById('signinButton').setAttribute('style', 'display: none');
console.log('signed in');
} else if (authResult['error']) {
// There was an error.
// Possible error codes:
// "access_denied" - User denied access to your app
// "immediate_failed" - Could not automatically log in the user
// console.log('There was an error: ' + authResult['error']);
}
}
</script>
<!-- Place this asynchronous JavaScript just before your </body> tag -->
<script type="text/javascript">
(function() {
var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
po.src = 'https://apis.google.com/js/client:plusone.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
})();
</script>
</body>
</html>
I had the same problem when I was trying that code sample. When trying to figure it out, I found this post:
https://groups.google.com/forum/?fromgroups#!topic/google-plus-developers/Ax3cMLhMR4Q
in the Google+ Developers Forum that seems to indicate that it's not really an 'error' but some kind of warning. If I find out more, I'll post an update here.
Hope this helps.