How to Track Button Clicks in WordPress Without Google Tag Manager

Why Track Button Clicks?

Table of Contents

Tracking button clicks helps you understand what actions visitors are taking. Whether it’s a “Buy Now”, “Download”, or “Contact Us” button, knowing the click-through rate gives valuable insights to improve your site and conversions.

You don’t need GTM — you can do it with Google Analytics 4 (GA4) and a bit of JavaScript.

Step 1: Ensure Google Analytics 4 Is Installed

Before anything else, make sure GA4 is active on your site. If not, check this tutorial: Set up Google Analytics 4.

If you’re not using a plugin, add the GA4 global site tag manually in your <head>:


&lt;script async src="https://www.googletagmanager.com/gtag/js?id=G-XXXXXXX"&gt;&lt;/script&gt;
&lt;script&gt;
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());
  gtag('config', 'G-XXXXXXX');
&lt;/script&gt;

Step 2: Add a Custom JavaScript Tracker for Button Clicks

You can track button clicks by using GA4’s gtag('event') API. Example:


// Add this inside a &lt;script&gt; tag or enqueue it via functions.php
document.addEventListener('DOMContentLoaded', function () {
  const trackableButtons = document.querySelectorAll('.track-button');

  trackableButtons.forEach(button =&gt; {
    button.addEventListener('click', function () {
      gtag('event', 'button_click', {
        'event_category': 'engagement',
        'event_label': button.innerText || 'Unnamed Button',
        'value': 1
      });
    });
  });
});

This sends a custom event to GA4 whenever a button with the class .track-button is clicked.

Step 3: Add the Class to Your Buttons

Now, simply add class="track-button" to any button you want to track:


&lt;a href="/contact" class="track-button btn"&gt;Contact Us&lt;/a&gt;

You can use this with <button> elements or styled links — both work!

Step 4: View Click Data in Google Analytics 4

Go to your GA4 dashboard:

Reports > Engagement > Events
Look for the event name: button_click

From there, you can view labels (button texts), total clicks, and engagement time.

Bonus: Track Specific Buttons with Unique Labels

Want to track different buttons separately? Use data-label attributes:


&lt;a href="/download" class="track-button" data-label="Download Guide"&gt;Download&lt;/a&gt;

Update your JS to support it:


gtag('event', 'button_click', {
  'event_category': 'engagement',
  'event_label': button.dataset.label || button.innerText,
  'value': 1
});

Conclusion

You don’t need Google Tag Manager to track button clicks on your WordPress site. With a few lines of JavaScript and a GA4 property, you can send custom click events and monitor user interactions effectively — all while keeping your site lightweight.

Back to all articles