Google Ads Conversion Tracking On Click


Userlevel 6
  • Former Unbouncer
  • 198 replies

community tips scripts banner

Tracking an Adwords conversion on the click of a button requires a small amount of custom code in Unbounce. A click event needs to be attached to the button in order to trigger the Adwords conversion code. Follow the steps below to start tracking an Adwords conversion on the click of a button.


🚨
This is not an official Unbounce feature. This functionality is based entirely on third party code, and has only been tested in limited applications. Since this isn’t a supported Unbounce feature, our support team will be unable to assist if things go awry. So if you are not comfortable with HTML, Javascript and CSS, please consider consulting an experienced developer.


Step 1.

Follow the click-specific Google Ads Set Up Instructions https://support.google.com/google-ads/answer/6331304?hl=en&ref_topic=3165803

Step 2.

Add the conversion code generated in Adwords to the page via the Javascript tab at the bottom of the page builder (this is essentially taking care of step 3 in Google’s documentation).

Step 3.

Step 4 in Google’s instructions is to add the html for a button to the page and give it an “onclick” attribute to trigger the conversion script. The html of a button cannot be edited in Unbounce, so instead the click event can be added to the button using some javascript. There are two approaches that can be used to trigger the conversion code from Adwords:

Assiging an onclick Attribute
The following code will generate the html as per Google’s documentation (remember to add the button ID and the URL for the Adwords conversion):

<script>
$(’#button-ID’).attr(‘onclick’, ‘goog_report_conversion (“https://domain-to-attribute-conversion-to.com”)’);
</script>

Assign a Click Event to the Button
If you are using a later version of jQuery than what’s supplied by default in the builder (1.4.2) the .attr() function used above will not work. If this is the case the following code will work instead (same as above remember to add the button ID and the URL for the Adwords conversion):

<script>
$("#button-ID").click(function() {
goog_report_conversion (“https://domain-to-attribute-conversion-to.com”);
});
</script>

Step 4.

Save and republish the page 🙂


Want to take your Unbounce landing pages + Convertables™ to the next level?
:spinbounce: Check out the Ultimate List of Unbounce Tips, Scripts & Hacks


25 replies

Thank you,

I’m currently waiting for Google’s support to help me as well since according to them I don’t need to do it this way, so I’m currently on standby, but if they can’t help me and it still doesn’t work, I’ll try this.

Thanks again,

Thanks for writing this helpful post, Rob!

I’m having a little bit of trouble implementing the code. Where do we find the URL to use for the conversion? Is it located in the conversion tag from Google? (the https://domain-to-attrtibue-conversion-to.com section)

Any insight would be appreciated. 🙂 Thanks!

Userlevel 6

Hi @Andrew_Kopp yes that’s correct you got it! It’s the URL in the conversion tag from Google. Usually this would be the URL for the landing page the conversion is happening on, but it does depend a bit on the specific use case. The relevant URL from the example in Google’s docs is here: https://www.screencast.com/t/VZHMpTQoBvv

Where in the javascript section do we add the script. Header, before body tag, after body tag etc?

Userlevel 3
Badge +1

Hey, do you think this should work for a link to a whatsapp number? E.g. https://api.whatsapp.com/send?phone=PHONENUMBER&text=MESSAGE

I’ve tried this several times and it never works. Anyone have any tips?

Userlevel 3
Badge +1

I was able to make it work. If you can share a link maybe we can find out what is wrong.

Hi there, I’m having some problems adding the unbounce script, I’ll attach a picture, I’m kind of unsure what needs to be changed.

I can see that the formatting isn’t correct but I’m not sure what to change.

Help would be greatly appreciated!

Thanks.

Hey there, was wondering if you could take a look at what I have so far. I can’t seem to get the script to work properly. Could you send a pic of the code you have the works?

Userlevel 3
Badge +1

Well, for instance, that closing tag is wrong.
You should close it with </script> instead of <script>

You might also want to share the link and the full code here. It will help us to troubleshoot your issue.

Thanks for that, just fixed that closing tag but it is still throwing an error for me.

The link to the landing page is https://warrensturf.net/fall-sale

And this is the full code I have right now:

Userlevel 3
Badge +1

I will check it now, by the way, your landing page doesn’t seem to work without www

Interesting, good to note… I’m assuming that change needs to be made for that attribution URL then?

BTW thanks for the speedy help

Userlevel 3
Badge +1

For some reason the code is not being loaded on my end.
Please do the following:

  1. Go to line 20 and change ("https://warrensturf.net/fall-sale") with ("https://www.warrensturf.net/fall-sale/clkg/tel/5303645679")
  2. Place it before the body end tag
  3. Republish

Just republished that. My other Google tracking codes are usually in the head tag, what’s different about this one?

Userlevel 3
Badge +1

It should be in the head but I just want to make sure this is being loaded after your global tag.

Okay gotcha, it still is throwing an error after adding in the new URL. Not sure what needs to be done here 😕

Userlevel 3
Badge +1

Sorry Daniel, I was out of the office. It seems your page is not published anymore.

Should be republished now. I changed the script per Rob (post author’s) recommendation. He removed the “clkn” reference in the URL as that is something that’s added as part of Unbounce’s native tracking and could cause some issues with Google’s tracking.

  <script>
    $('#lp-pom-button-163').attr('onclick', 'goog_report_conversion("https://www.warrensturf.net/fall-sale/tel/5303645679")');
    </script>

Did you ever get this to work. I never have.

Unfortunately, no.

The code above will not work.
You need to load your jQuery before your script can run.
$(document).ready(function () {}
Please note as well, google change the conversion script from goog_report_conversion to gtag_report_conversion
Do it like this

<script>
function gtag_report_conversion(url) {
  var callback = function () {
    if (typeof(url) != 'undefined') {
      window.location = url;
    }
  };
  gtag('event', 'conversion', {
      'send_to': 'YOUR OWN CONVERSION ID',
      'event_callback': callback
  });
  return false;
}
$(document).ready(function () {
  $("#YOUR BUTTON ID").click(function () {
    gtag_report_conversion("YOUR URL AFTER BUTTON IS SUBMITTED");
  });

});
</script>

Did Anyone mange to get this to wok I am still struggling…?

Badge +1

Has anyone got this to work?

Userlevel 1
Badge

It’s kind of crazy how such a simple but useful function to add code to a button isn’t in Unbounced.

Reply