Search code examples
rubygoogle-analyticshamlpartials

How to use an environment variable for Google Analytics tracking ID in a Haml partial


I'm trying to add Google Analytics tag to my web application, which runs Ruby on Rails.

I'd like to deploy the same code to multiple environments, development, staging, production, and to configure a different Google Analytics tracking ID via an environment variable in each of these instances. Each of my environments are set up on a different domain, so I set up separate Properties in Google Analytics and set a new environment variable (GOOGLE_ANALYTICS_TRACKING_ID) on the servers.

I'd like to use a partial Haml file to hold the Google Analytics tag and use the environment variable. I found an example in "Cant get google analytics working on rails project", but I don't know how to pass the environment variable in.

app/views/stubs/_ga.haml:

:javascript
  (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', GOOGLE_ANALYTICS_TRACKING_ID_ENV_VAR, 'auto');
  ga('send', 'pageview');

app/views/layouts/base.html.haml:

%html
  %head
    = stylesheet_link_tag    'application', media: 'all'
    = javascript_include_tag 'application'

    = render 'stubs/ga'
  %body
    = yield

Note, that I included GOOGLE_ANALYTICS_TRACKING_ID_ENV_VAR as a placeholder. I tried a few representations, but I haven't been able to get the tracking code working. The Google Tag Assistant Chrome extension reports that no tags were found on the page and I see syntax errors in the browser console.

What would be the best way to structure the partial code and the render call in order to ensure the Google Analytics tracking code is dynamic for each environment and pulls in the environment variable?


Solution

  • Here's one possible solution:

    app/views/stubs/_ga.haml

    :javascript
      (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', '#{env['GOOGLE_ANALYTICS_TRACKING_ID']}', 'auto');
      ga('send', 'pageview');
    

    app/views/layouts/base.html.haml

    %html
      %head
        = stylesheet_link_tag    'application', media: 'all'
        = javascript_include_tag 'application'
    
        = render 'stubs/ga', :env => ENV
      %body
        = yield
    

    Note that I'm explicitly passing in ENV as an argument to the call to render. I came up with this solution as I was composing the question and iterating using different syntax. It works, but I'm not sure if it's the best solution. Any other recommendations for how to achieve this objective, namely to deploy the same code to different instances and track the analytics separately?