Add GA tracking to new badges site

[adamlofting]

• [ ] Use an environment variable for the option to vary between dev, staging and prod

Prod:

<script>
  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-49796218-6', 'mozilla.org');
  ga('send', 'pageview');

</script>

[adamlofting]

@andrewhayward @christensenep - do you want to do anything specific with managing .js files included, or shall I just add things into base/static/js and then into base.html?

[andrewhayward]

What would be different about this in the various environments? Just thinking how best to go about configuring the script.

[adamlofting]

This is an optional extra really, but we could set an alternative GA-account-id and GA-domain on staging and prod. That way we can test any changes to GA tracking on staging.

[adamlofting]

I'll open a PR, so we can discuss in relation to actual code :)

[adamlofting]

Here's what I was thinking (re-using the existing process from webmaker): https://github.com/mozilla/mozilla-badges/pull/20/files#diff-31d2b15bbb55166af1f9ee9f958ea6dfR183

[andrewhayward]

I'll ask implementation questions on the issue itself.