I have an Asp.net mvc site with Google adsense enabled with scripts added in the Layout.cs and contents getting generated via ajax and jquery from api. Everything was working fine and ads where showing
Recently I had added a new page where I used angularjs for databinding using CDN .and the page is working well.but ads stopped showing up. only on that page.the message showing on console is
The resource http://pagead2.googlesyndication.com/pagead/js/r20190313/r20190131/show_ads_impl.js was preloaded using link preload but not used within a few seconds from the window's load event. Please make sure it has an appropriate as value and it is preloaded intentionally.
And in Layout.cs
<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<script>
(adsbygoogle = window.adsbygoogle || []).push({
google_ad_client: "ca-pub-1771190807684402",
enable_page_level_ads: true
});
</script>
Adding URL of my Site for reference
JumptoJob-Online exam
And my angularjs controller for page looks simple
<script>
"use strict";
/*We need to manually start angular as we need to
wait for the google charting libs to be ready*/
var mainApp = angular.module("mainApp", ['googlechart']);
mainApp.controller('QuestionController', myControllerFunction);
myControllerFunction.$inject = ["$scope", "$http", "$timeout"];
function myControllerFunction($scope, $http, $timeout) {
}
</script>
I contacted adsense support and provided the URL.they asked me to wait for some hours and then ad start showing. asper them its always better to use adsense directive with angularjs than just using normal adsense script and auto ads
Related
I'm trying to set up Google Analytics 4 on my react site. Previously I used react-ga, but this library doesn't support Google Analytics 4 yet. I pasted the GA4 tag directly into the index.html file without an external library. What additional code do I need to add to get GA4 to work with react router?
Thanks in advance!
You can call gtag directly. Just put the global site tag code in your index.html <head>.
<!-- Global site tag (gtag.js) - Google Analytics -->
<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>
I was facing the same issue today and ended up pulling out the react-ga package and going this route. I saved the withTracker.js piece from the react-ga demo code and modified it like below.
export default function withTracker(WrappedComponent, options = {}) {
const trackPage = (page) => {
window.gtag('send', 'page_view', {
page_location: window.location.href,
page_path: window.location.pathname
});
};
...
You can also checkout the npm package ga-4-react:
https://www.npmjs.com/package/ga-4-react
You should be able stop using react-ga and just insert the global script tag in index.html as Cameron mentioned. Keep in mind you'll likely need to ensure that your app is updating both the window.location and document.title for GA4 work as desired.
Google's docs mention:
"When a pageview is sent to Analytics, the default page parameter values are used, unless modified. This means you do not need to modify page_title or page_location parameters if updates to window.location (e.g. via the History API) and document.title are made prior to the event being sent.".
I have a simple single page application and wasn't receiving detailed page view data until I updated the title AND location at each render.
Background: There are 2 types of Google Analytics properties: Universal Analytics (UA-xxxxxxxxx-x) which is deprecated with the end of life on 2023.07.01 and Google Analytics 4 property (G-xxxxxxxxxx) which is the replacement.
The simplest way to get started is to follow Google's guide: include gtag on the page and use it as window.gtag. This method works for both old and new tags and there's even TypeScript support via #types/gtag.js. The script can be loaded async as recommended.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<!-- ... -->
<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>
<!-- ... -->
</head>
<body>
<!-- ... -->
</body>
</html>
Keep in mind that Google Analytics does automatic page tracking, but this will not work for every use case. For example, hash and search parameter changes are not tracked. This can lead to a lot of confusion. For example, when using HashRouter or anchor links the navigation will not be tracked. To have full control over page view tracking you can disable automatic tracking. See for a detailed explanation: The Ultimate Guide to Google Analytics (UA & GA4) on React (Or Anything Else
Manual page tracking: https://stackoverflow.com/a/63249329/2771889
You can see this working in cra-typescript-starter where I'm also setting the tag from an env var.
No additional code is needed, just paste that tag into the index.html and Google Analytics will track all your urls.
I am working with MVC5 and angukarJS and i want to use angularJS material in mt project. I downloaded all the required packets but i am stuck at 1 point. Whenever i try to use ng-material my screen becomes blank.
var app = angular.module("myApp", []); it shows my form but CSS not showing.
var app = angular.module("myApp", ['ngmaterial']);Screen become blank.
Previuosly when I use ng-map it was working fine but now its not working, I get blank map. I am getting this error from google map api:
The Google Maps JavaScript API must be downloaded directly from
Google's servers. Learn more:
https://developers.google.com/maps/documentation/javascript/tutorial#Loading_the_Maps_API
you should be downloading the google maps JS from google's servers, as stated in ng-maps' DOCS
Include Google maps:
<script src="http://maps.google.com/maps/api/js"></script>
Name your angular app ngMap, or add it as a dependency
var myApp = angular.module('myApp', ['ngMap']);
am looking to use a forerunnerDB , as a standalone database and running an electron framework to create a desktop ,
am having problem implementing the bootstrapped process,
var ForerunnerDB = require('forerunnerdb');
var fdb = new ForerunnerDB();
am using angular as the frontend , and electron bootstrapping ,
angular.module('RDash')
.controller('MasterCtrl', ['$scope', '$cookieStore', MasterCtrl])
.controller('tableCtrl',['$scope', '$cookieStore', tableCtrl]);
var ForerunnerDB = require('forerunnerdb');
var fdb = new ForerunnerDB();
but i get require == undefined error , where do bootstrap the forerunner
The require() call is part of Node.js used to include modules for use. If you are trying to instantiate ForerunnerDB on the client-side or in a browser you need to include the file ./dist/fdb-all.min.js instead (which is included in the ForerunnerDB download) as described in the documentation here: https://github.com/Irrelon/ForerunnerDB#use-forerunnerdb-in-browser
In the index.html of your AngularJS app, put this in the <head> section before your angular scripts but after jQuery and other third party libraries:
<script src="./forerunnerdb/dist/fdb-all.min.js" type="text/javascript"></script>
Make sure you change the path of the file to wherever you have put ForerunnerDB.
Disclaimer: I am the creator of ForerunnerDB
I am new to this Django-Angular JS integration. I created few web pages in AngularJS, views were working fine. As soon as I integrated with Django, first I had to correct paths to work but still views are not working. The view part stays blank and also grows in length (as if it goes into some loop!). Any idea guys?
EDIT:
Below is the way I am calling the view inside verbatim section of index.html
<div ng-view=""></div>
My js config file:
'use strict';
var mainAngular = angular.module('bazaar',['ui.bootstrap', 'ngRoute', 'ngCookies']).run(function($http, $cookies) {
$http.defaults.headers.post['X-CSRFToken'] = $cookies.csrftoken;
});
mainAngular.config(function($routeProvider, $locationProvider) {
$routeProvider
.when('/', {
templateUrl: "../static/views/welcomeView.html"
})
I have just pasted the code which I am using for view call. Let me know if its helpful or you guys need more details.
Well, I found out the issue so thought to drop the answer as well so that It may be helpful for other newbies like me.
I was including js file in my view ealier (which was working completely fine when run as a separate page using Tomcat) , but as soon as I integrated with Django I had to remove all js file path from <script> tag and Bingo !!