I just want to add google analytics to my quasar ssr application.
I have just updated the head tag in the index.template.html. Is it enough for ssr application?
<!DOCTYPE html>
<html>
<head>
<script
async
src="https://www.googletagmanager.com/gtag/js?id=..."
></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag("js", new Date());
gtag("config", "my-code");
</script>
</head>
<body>
<!-- DO NOT touch the following DIV -->
<div id="q-app"></div>
</body>
</html>
Related
I am trying to send events to Google Analytics v4 property from a local application. I am testing with code inside a local html file (see code below).
If I deploy this file on a webhost, I can see incoming events in GA DebugView after loading page - as expected.
It does not work, if I open this file locally. If this code does not work locally, it also won't work in some electron app, right? Or have I misunderstood something? If it works on a webhost but not locally - does anything have to be configured differently in Google Analytics?
If executed locally, in developer console I get error messages like this:
Tag fired: {function: "__get", vtp_eventName: "scroll", vtp_settings: ["map", "streamId", "G-XXXXXXXXXX", "eventParameters", ["map", "percent_scrolled", ["macro", 19]]], vtp_deferrable: false, tag_id: 29}
Unallowed document protocol.
Event processing aborted.
index.html
(... with replaced measurement ID as G-XXXXXXXXXX)
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXXXXX"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag() { dataLayer.push(arguments); }
gtag('js', new Date());
gtag('config', 'G-XXXXXXXXXX');
</script>
<script>
function fire() {
gtag('event', 'ACTION', {
'event_category': 'CATEGORY',
'event_label': 'LABEL',
'value': 1
});
}
</script>
</head>
<body>
page loaded ...
<button onclick="fire()">fire event!</button>
</body>
</html>
Hi i want use the toastr notifications for angular js
this: https://github.com/Foxandxss/angular-toastr
I have my controller and my index, in mi index y imports all css's and js's for work with my app, but when i tried inject my toastr script in my controller the console show this error
Unknown provider: toastrProvider <- toastr <- clientController
my index:
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css" />
<link rel="stylesheet" href="angular/angular-toastr/dist/angular-toastr.min.css" />
<script src="bootstrap/js/bootstrap.min.js"></script>
<script src="angular/angular.min.js"></script>
<script src="angular/angular-route/angular-route.min.js"></script>
<script src="angular/angular-toastr/dist/angular-toastr.min.js"></script>
<!-- <script src="resources/angular/angular-toastr/dist/angular-toastr.tpls.js"></script> also try -->
</head>
<body ng-app="app">
<li><a href="#!client">new client</li>
<div class="container">
<div ng-view></div>
</div>
<script src="app/runConfig.js"></script>
<script src="app/controllers/client.conroller.js"></script>
</body>
</html>
my controller:
(function () {
'use stritct';
angular
.module('app')
.controller('clientController', clientController);
clientController.inject = ['$rootScope', '$scope', '$location', 'toastr'];
function clientController($rootScope, $scope, $location, toastr) {
}
})();
You are almost there, you missed injecting the toastr service in to the app module. This is shown in the setup on the github.
angular.module('app', ['toastr'])
I have a goal in Google Analytics that does not work for a reason that I do not understand. Conversions are not counted.
What could be the problem?
Here's how I set the goal in the site code:
<!DOCTYPE html>
<html lang="ru">
<head>
<!— Global site tag (gtag.js) - Google Analytics —>
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-108002615-1"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'UA-108002615-1');
</script>
</head>
<body>
<button onclick="gtag('event', 'best-goal-666', { 'event_category': 'Category', 'event_action': 'Action', 'event_label': 'click-button-347-2', 'value': 1});">RABOTAI BLYAT</button>
</body>
</html>
Screenshot of goal settings in google analytics
As it turned out there was no problem with the code.
Google Analytics counted the conversion after three days.
So if you have similar issue just try to wait for GA's periods will finish.
I'm trying to use jsTree in AngularJS powered MVC5 school project. To use jsTree in angular app I'm using this directive.
From what I can observe everthing working ok:
- jstree loads correctly data and structure, and fires all events
- jstree loads CSS style (if i change for instance margin in css, it's reflected to jstree, if remove css reference it rendered as ordinary HTML UL)
However it looks like, that rest of layout doesnt work:
- no background change, when i move cursor over node
- no conectors, no node images, no arrows
From what i was able to find it looks like that css is not using images referenced in it:
background-image: url("data:image/gif;base64,R0lGODlhCwAHAIAAACgoKP///yH5BAEAAAEALAAAAAALAAcAAAIORI4JlrqN1oMSnmmZDQUAOw==");
background-image: url("32px.png");
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAACAQMAAAB49I5GAAAABlBMVEUAAAAdHRvEkCwcAAAAAXRSTlMAQObYZgAAAAxJREFUCNdjAAMOBgAAGAAJMwQHdQAAAABJRU5ErkJggg==");
So I tried to use:
bundles.Add(new StyleBundle("~/jstree").Include(
"~/Content/jstree/style.css", new CssRewriteUrlTransform()));
Css with images is placed in same folder:
But that also did not worked. Any ideas? Sugestions?
Rest of the code:
angular.module('JosefinaApp', ['ui.layout', 'JosefinaApp.controllers', 'jsTree.directive']);
angular.module('JosefinaApp.controllers', [])
.controller('TreeViewController', ['$scope', '$location', '$http', function ($scope, $location, $http) {
$location.path('/home');
$http({
method: 'GET',
url: '/api/project/gettasks/1',
}).
success(function (data) {
$scope.treeModel = data;
}).
error(function () {
$scope.test = "Error";
});
$scope.treeViewNodeSelected = function (e, data) {
console.log(data.node.id);
};
}])
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title ng-bind="models.helloAngular"></title>
<script src="#Url.Content("~/Scripts/plugins/jquery.validate.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/plugins/jquery.validate.unobtrusive.js")" type="text/javascript"></script>
<script src="#Url.Content("~/Scripts/jquery-2.1.4.min.js")" type="text/javascript"> </script>
<link href="#Url.Content("~/Content/themes/base/all.css")" rel="stylesheet" type="text/css" />
#Styles.Render("~/Content/css")
#Styles.Render("~/jqueryUI")
#Styles.Render("~/uiLayout")
#Styles.Render("~/jstree")
#Scripts.Render("~/bundles/modernizr")
#Scripts.Render("~/bundles/jquery")
#Scripts.Render("~/bundles/jqueryUI")
<script src="#Url.Content("~/Scripts/angular.js")" type="text/javascript"> </script>
<script src="#Url.Content("~/Scripts/angular-ui-router.js")" type="text/javascript"> </script>
<script src="#Url.Content("~/Scripts/angular-resource.js")" type="text/javascript"> </script>
<script src="#Url.Content("~/Scripts/angular-ui/ui-layout.js")" type="text/javascript"> </script>
<script src="#Url.Content("~/Scripts/jstree/jstree.js")" type="text/javascript"> </script>
<script src="#Url.Content("~/Scripts/jstree/jsTree.directive.js")" type="text/javascript"> </script>
<script src="#Url.Content("~/Scripts/JosefinaApp.js")" type="text/javascript"> </script>
<script src="#Url.Content("~/Scripts/Controllers/LandingPageController.js")" type="text/javascript"> </script>
<script src="#Url.Content("~/Scripts/Controllers/TreeViewController.js")" type="text/javascript"> </script>
</head>
<body>
<div ng-app="JosefinaApp">
<div ng-controller="TreeViewController">
<js-tree theme="default" tree-events="select_node:treeViewNodeSelected" tree-data="scope" tree-model="treeModel">
</js-tree>
</div>
</div>
#RenderBody()
#Scripts.Render("~/bundles/bootstrap")
#RenderSection("scripts", required: false)
</body>
</html>
Browser stored images, internet explorer was caching empty images and showing them instead of geting them from server.
... kill me please
One ad unit just stopped to work and after trying to generate new code it is still not working. When I use google console it is just showing warning Ad unit failed to fetch. Other 3 ads are working normally. They are inserted before I started to work on this project.
New ad code is generated like
header
<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() {
googletag.defineSlot('/6000854/R300x250_L', [300, 250], 'div-gpt-ad-1367703773182-0').addService(googletag.pubads());
googletag.pubads().enableSingleRequest();
googletag.enableServices();
});
</script>
body
<!-- R300x250_L -->
<div id='div-gpt-ad-1367703773182-0' style='width:300px; height:250px;'>
<script type='text/javascript'>
googletag.cmd.push(function() { googletag.display('div-gpt-ad-1367703773182-0'); });
</script>
</div>
Old code is generated like
header
<script type='text/javascript' src='http://partner.googleadservices.com/gampad/google_service.js'></script>
<script type='text/javascript'>
GS_googleAddAdSenseService("ca-pub-2838961657718357");
GS_googleEnableAllServices();
</script>
<script type='text/javascript'>
GA_googleAddSlot("ca-pub-2838961657718357", "Top728x90");
GA_googleAddSlot("ca-pub-2838961657718357", "Right300x250");
GA_googleAddSlot("ca-pub-2838961657718357", "Right300x250Bottom");
</script>
<script type='text/javascript'>
GA_googleFetchAds();
</script>
body
<!-- Right300x250Bottom -->
<script type='text/javascript'>
GA_googleFillSlot("Right300x250Bottom");
</script>
Is there maybe conflict because of diferent tags or code
NOTE: I am just wordpress front end developer, I don't have access to google DFP services and I am not generating tags or code
EDIT: Based on this discussion it looks like using the old GAM tags with GPT tags may now be an issue (just recently) http://productforums.google.com/forum/#!topic/dfp/snK7znwUMBE
I think you should convert the GAM tags to to GPT tags and use just the DFP GPT tags if possible to stop this happening... its most probably a conflict between the two scripts and depending on the order they get loaded the GPT tags may not work...
ORIGINAL:
I just tried your code and two ads showed as expected. So there does not appear to be any conflicts using both scripts at the same time.
Potentially you have been refreshing the page so many times that there are no ads that will be displaying for you through DFP anymore because of rate limits? That is just a wild guess though. If I refresh the page a lot I do get the failed to fetch message every now and then in the console so I think it is probably just a rate limit and something that a normal user will not have a problem with.
This is the code that I am using, two 300x250 ads show on the page so everything is working correctly.
<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() {
googletag.defineSlot('/6000854/R300x250_L', [300, 250], 'div-gpt-ad-1367703773182-0').addService(googletag.pubads());
googletag.pubads().enableSingleRequest();
googletag.enableServices();
});
</script>
<script type='text/javascript' src='http://partner.googleadservices.com/gampad/google_service.js'></script>
<script type='text/javascript'>
GS_googleAddAdSenseService("ca-pub-2838961657718357");
GS_googleEnableAllServices();
</script>
<script type='text/javascript'>
GA_googleAddSlot("ca-pub-2838961657718357", "Top728x90");
GA_googleAddSlot("ca-pub-2838961657718357", "Right300x250");
GA_googleAddSlot("ca-pub-2838961657718357", "Right300x250Bottom");
</script>
<script type='text/javascript'>
GA_googleFetchAds();
</script>
</head>
<body>
<!-- R300x250_L -->
<div id='div-gpt-ad-1367703773182-0' style='width:300px; height:250px;'>
<script type='text/javascript'>
googletag.cmd.push(function() { googletag.display('div-gpt-ad-1367703773182-0'); });
</script>
</div>
<!-- Right300x250Bottom -->
<script type='text/javascript'>
GA_googleFillSlot("Right300x250Bottom");
</script>
</body>
</html>