Google Ads Demo

Overview

We built a simple page with one Buy button. Now let's serve it in a Google ad, with a goal of clicking out.

This demo assumes the page itself already exists. From here, we'll work in roughly this order:

1. Create a conversion action in Google Ads, so it knows what counts as a sale.
2. Send that conversion from the page, using Custom JS or GTM (pick one).
3. Test it, so we know it's actually firing before serving the ad.
4. Optional: Modify tracking to one specific button.
5. Build the campaign that will actually use this conversion.

The ad and campaign come last, once tracking is confirmed working end to end, not first.

Create the Conversion Action

Send the Conversion

There are two ways to do this: a short script you paste in yourself, or a setup in Google Tag Manager.

Option A, Custom JS

Add Custom Code to the account or page level. See Custom Code for more info.

This script comes straight from Google Ads, not GTM. It's the same "Manually with code" snippet Google showed us back in Create the Conversion Action. We asked the SuperAgent to add it to the page's Head, a Google tag plus a click listener that sends the conversion and waits up to a second before navigating:

<script async src="https://www.googletagmanager.com/gtag/js?id=AW-18157817080"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'AW-18157817080');
document.addEventListener('click', function (e) {
  var a = e.target.closest('[data-button-id="898a581c"]');
  if (!a || a.dataset.sent) return;
  a.dataset.sent = '1';
  var go = function () { window.location.href = a.href; };
  gtag('event', 'conversion', {
    send_to: 'AW-18157817080/Z2L0CP_Oo4odEPiZqdJD',
    event_callback: go,
  });
  setTimeout(go, 1000);
});
</script>

A couple of things worth understanding in this script:

• send_to: 'AW-18157817080/Z2L0CP_Oo4odEPiZqdJD' tells Google Ads which conversion to credit. The first part, AW-18157817080, identifies your Google Ads account. The second part, Z2L0CP_Oo4odEPiZqdJD, is the Conversion Label from Copy the Conversion ID and Label above, it identifies this specific conversion action.
• data-button-id="898a581c" is an ID SuperFunnel automatically adds to every button on your page, so a script can target one specific button reliably instead of relying on its text or position, either of which might change. You can find a button's own ID by inspecting it in your browser's dev tools, or from the Data Layer output shown later in Track One Button.

Replace the Google Ads ID, Conversion Label, and data-button-id with your own.

We published the page, opened the browser's Network tab, clicked the button, and confirmed a request went out to Google the moment we clicked. Then we turned the snippet off, since this demo also sets up the same tracking in GTM below, and running both at once double counts every click. Leave it on if you want to skip GTM and run Custom JS only.

Option B, Google Tag Manager

Test It

Track One Button Instead of Every Conversion

superfunnel-conversion fires for any conversion on the page, click-outs and form submits alike. To track just one button, add a Data Layer Variable for extra.buttonId, then set the trigger to Some Custom Events where that variable equals your button's ID.

Build the Campaign

What's Next