Trigger Meta Pixel with the click of a button

[Mauro]

So I’m at a lost here. I’ve already installed the pixel code successfully, and wanted to track it to the click of a specific button. I applied the ID ‘tracker’ to said button and went ahead and added an embed code on the page with the following Javascript.

<script>
  document.addEventListener('DOMContentLoaded', function() {
    var button = document.getElementById('tracker');
    button.addEventListener('click', function() {
      fbq('track', 'Lead');
    });
  });
</script>

This is the site I’m working on: https://maxreachtools.com/

Am I doing things right? can anyone help?
Thanks in advance.

---

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

[ChrisDrit]

Welcome @Mauro

@Mauro

Am I doing things right? can anyone help?

Hard to tell.

Here’s the first thing I find:

The JS itself doesn’t stand out as being wrong, but you can help yourself by doing something like this to debug:

<script>
  console.log("--- 1")
  document.addEventListener('DOMContentLoaded', function() {
    console.log("--- 2")
    var button = document.getElementById('tracker');
    console.log("--- 3 w/button: ", button)
    button.addEventListener('click', function() {
      console.log("--- 4")
      fbq('track', 'Lead');
    });
  });
</script>

That’ll help you to understand where exactly it’s failing, but first things first, fix those errors reported.

That code (minus the fbq function call) runs fine for me so maybe something else on your site is causing an issue.

It’s a starting point at the very least.

[Mauro]

Thank you so much for the reply. I updated the code to what you suggested and this is what my console is looking like. Not really sure what this means (sorry, I’m not the most adept at coding).

PS. I got the javascript code from ChatGPT, hence my suspicion that it might not be fully working. I also don’t have access to the Meta Business account to check whether it is working or not.

[ChrisDrit]

No worries.

@Mauro

PS. I got the javascript code from ChatGPT, hence my suspicion that it might not be fully working.

Yea, seeing this more and more of this these days.

One (and there are many) standout issues is that ---3 w/button: doesn’t actually dump the button element to the logs. So it’s not found and most likely causes the Uncaught TypeError showing afterwards.

Always make sure that CSS id field exists and is spelled correctly (with the correct casing).

That’s causing your problem here most likely.

@Mauro

Not really sure what this means (sorry, I’m not the most adept at coding).

At this point your best options are to keep slogging through it on your own and skill up in these areas or hire someone to help you. It’s a bit too time consuming for me to debug my way through this on a forum post.

Though… maybe someone else has the availability to do so in this thread

Sorry it’s not the answer you’re looking for.

[Mauro]

That’s alright. Thanks for trying to help!