22
votes

I have a button on my website, clicking on this button reveals a phonenumber.

HTML

<div class="call-wrapper-middle">
    <button id="call-phone-middle"><i class="fa fa-phone"></i>Call us</button>
    <div class="call-number-middle" style="display: block;"> <a href="tel:555" class="number">555</a></div>
</div>

Using the following jQuery

(function($) {
  $("button#call-phone-middle").click(function() {
    $(this).hide();
    $("div.call-number-middle").show();
  });
})(jQuery);

This works great. But I also wish to track the clicks on the button as a goal in Google Analytics.

So I added href="/show/phonenumber-middle" onclick="javascript:pageTracker._trackPageview (‘Phonenumber Middle’);" target="blank" to the button:

<div class="call-wrapper-middle">
    <button href="/show/phonenumber-middle" onclick="javascript:pageTracker._trackPageview (‘Phonenumber Middle’);" target="blank" id="call-phone-middle"><i class="fa fa-phone"></i>Call us</button>
    <div class="call-number-middle" style="display: block;"> <a href="tel:555" class="number">555</a></div>
</div>

And added a goal in Google Analytics with the following settings:.

Goal setup: Custom
Goal type: Destination
Destination; Equals to: /show/phonenumber-middle

Getting "This Goal would have a 0% conversion rate based on your data" and in the Real Time report there is no conversations.

My guess is that something is wrong with the <button> but I have no clue.

1
Are you seeing anything in the real time reports when you click the button? - nyuen
Yes, I am seeing myself, 1 active user. - Liu Kang
If you can see events come through in RT, then you may just need to wait for the data to be processed, and this takes up to 24 hours. - nyuen
There no events triggering in the Real Time report. - Liu Kang
I'm assuming you clicked the button and checked, and that you are not filtering your own visits as well? - nyuen

1 Answers

46
votes

I would use a Google Analytics event for this. Here is the documentation for a GA click event. Then in goals, you would set your goal type to event, and you can track it via the Category, Action, or Label attributes

<div class="call-wrapper-middle">
    <button href="/show/phonenumber-middle" onclick="__gaTracker('send', 'event', 'buttons', 'click', 'phone-number-middle');" target="blank" id="call-phone-middle" style="display: none;"><i class="fa fa-phone"></i>Call us</button>
    <div class="call-number-middle" style="display: block;"> <a href="tel:555" class="number">555</a></div>
</div>