YepNope (Modernizr) and Google Analytics

Im using the large async script yepnope.js loader (in Modernizr2).

My question is: what is the best way to enable latset asynchronous Google Analtics code in yepnope (if at all)?

Google offers this for the actual analytics code:

<html> <head> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-XXXXX-X']); _gaq.push(['_trackPageview']); </script> </head> <body> <p>Page Content</p> <script src="some_random_script.js"></script> <p>Page Content</p> <script type="text/javascript"> (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> </body> </html> 

But in Modernizrs docs they mention it:

 // Give Modernizr.load a string, an object, or an array of strings and objects Modernizr.load([ // Presentational polyfills { // Logical list of things we would normally need test : Modernizr.fontface && Modernizr.canvas && Modernizr.cssgradients, // Modernizr.load loads css and javascript by default nope : ['presentational-polyfill.js', 'presentational.css'] }, // Functional polyfills { // This just has to be truthy test : Modernizr.websockets && window.JSON, // socket-io.js and json2.js nope : 'functional-polyfills.js', // You can also give arrays of resources to load. both : [ 'app.js', 'extra.js' ], complete : function () { // Run this after everything in this group has downloaded // and executed, as well everything in all previous groups myApp.init(); } }, // Run your analytics after you've already kicked off all the rest // of your app. 'post-analytics.js' ]); 

Pay attention to the bottom line re: posting analytics. I do not want a new js file, as this is another HTTP request.

Should I keep this outside yepnope? Are there any advantages to hosting it within the yepnope system?

Adi

+4
source share
2 answers

I found this on the Ignited-HTML5-Boilerplate .

 <script> window._gaq = [['_setAccount','UAXXXXXXXX1'],['_trackPageview'],['_trackPageLoadTime']]; Modernizr.load({ load: ('https:' == location.protocol ? '//ssl' : '//www') + '.google-analytics.com/ga.js' }); </script> 
+7
source

Not sure if this is the β€œbest way” to include the latest google analytics code in yepnope, but a way to integrate google code in yepnope:

 <script type="text/javascript"> Modernizr.load([ { // WEB ANALYTICS loaded by yepnope (beta) test: Boolean(SITEID = ''), // TODO: Fill the site ID to activate analytics complete: function() { if (SITEID) { var _gaq=[['_setAccount',SITEID],['_trackPageview']]; (function(d,t){var g=d.createElement(t),s=d.getElementsByTagName(t)[0];g.async=1; g.src=('https:'==location.protocol?'//ssl':'//www')+'.google-analytics.com/ga.js'; s.parentNode.insertBefore(g,s)}(document,'script')); } } } ]); </script> 

It must be OK to place this code immediately before the </body> .

0
source

All Articles