Search code examples
reactjsgoogle-tag-managergoogle-ads-apinetlifygtag.js

Why Google Ads converion creation steps changed after production deploy?


I've been trying to create conversions on Google Ads after implementing small fixes to my site on Netlify. The fixes include changing button colors, adding a new button, etc. So there was no change on the GTM script. However, conversion steps were changed after a successful build on Netlify. I tried to go back to the 3-step-conversion-creation which is the way I used before the fix, I also tried to add a GTAG script to do that. I couldn't find an answer to why it has changed steps on conversion creation, because it doesn't allow me to create conversion via Google Tag Manager. I managed to go back to 3-steps-method before, I had created a new Google Ads account, but I can't use that method this time. Why it has changed? Is it about react or netlify or something else? You can view the screenshots and index.html below:

Before fix: Google Ads Conversion Creation After Deployment

After fix (Website already has GTAG and GTM): Google Ads Conversion Creation Before Deployment

index.html:

<!DOCTYPE html>
<html lang="en">

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

    gtag('config', 'AW-XXXXXXXXXXX');
  </script>
  <!-- Google Tag Manager -->
  <script>(function (w, d, s, l, i) {
      w[l] = w[l] || []; w[l].push({
        'gtm.start':
          new Date().getTime(), event: 'gtm.js'
      }); var f = d.getElementsByTagName(s)[0],
        j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : ''; j.async = true; j.src =
          'https://www.googletagmanager.com/gtm.js?id=' + i + dl; f.parentNode.insertBefore(j, f);
    })(window, document, 'script', 'dataLayer', 'GTM-XXXXXXX');</script>
  <!-- End Google Tag Manager -->
  <title>Website</title>
  <!-- Meta Pixel Code -->
  <!-- End Meta Pixel Code -->
</head>

<body>
  <div id="root"></div>
</body>

<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX" height="0" width="0"
    style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

</html>

Possible solutions to go back to 3-steps-conversion:

  • Delete BULK_ from the URL and press enter, it will direct there
  • Create a new Google Ads account but it is inconvenient and doesn't makes sense if you have balance, outsource data, etc. in that Google Ads account

Still, I have no idea why it has changed in that fix. It didn't happen on previous updates. I couldn't find any information about this. So I thought it might be related to the code. Thanks in advance.


Solution

  • I think it's just Google's way to nudge you into using their global site tag instead of individual conversion snippets.

    You can still access the "old" configuration screen if you enter your website's URL and then just select the "Add conversion actions manually using code" option:

    enter image description here