Why is my Google Analytics callto event tracking code not tracking?

Question

I am trying to track a call tel event when a button is clicked. My GA code was provided from the setup wizard.

<!-- Global site tag (gtag.js) - Google Analytics -->
    <script async src="https://www.googletagmanager.com/gtag/js?id={{site.google_analytics_tracking_id}}"></script>
    <script>
        window.dataLayer = window.dataLayer || [];
          function gtag(){dataLayer.push(arguments);}
          gtag('js', new Date());
          gtag('config', '{{site.google_analytics_tracking_id}}');
    </script>

And my button code is:

<!-- Banner -->
<section id="banner">
    <div class="inner">
        <header>
            <h2>{{ site.title }}</h2>
            <figure>
                <picture class="image logo">
                    <span class="icon logo fa-balance-scale"></span>
                </picture>
                <figcaption><small>Serving: {{ site.location }}</small></figcaption>
            </figure>
        </header>
        <p><strong>We Work Hard To Protect Your Rights!</strong></p>
        <footer>
            <ul class="buttons stacked">
                <button class="button fit">Call: <a href="tel:{{site.tel}}" onClick=”ga('send', 'event', 'Calls', 'clicked', 'Contact Office', 1);”>{{site.tel}}</a></button>
            </ul>
        </footer>
    </div>
</section>

Vote

Please up or down vote the question. Before down voting, suggest edits or leave comments?

Answer 1

You have GA implemented via gtag.js, the function you used for onClick is for analytics.js, so you need to use the right functions. You need to do it in this format:

gtag('event', <action>, {
  'event_category': <category>,
  'event_label': <label>,
  'value': <value>
});

so for your example:

gtag('event', 'clicked', {
  'event_category': 'Calls',
  'event_label': 'Contact Office',
  'value': 1
});