Cover photo for how to implement the Meta pixel using GTM

Track Meta Pixel & CAPI with GTM the Right Way

Recently, I worked with a client whose website ran on a completely custom WordPress theme — so custom, in fact, that my usual go-to plugin, PixelYourSite Pro, simply wouldn’t work.

For most WordPress projects, PixelYourSite Pro is my preferred tool to integrate Meta Pixel, GA4, and Google Ads tracking. It’s robust, feature-rich, and simplifies advanced tracking setups across browser and server. But in this case, the site’s architecture deviated from the standard WordPress structure that PixelYourSite expects — making it unusable.

That challenge led me to revisit how to track the Meta pixel with GTM — a more flexible and powerful setup using Google Tag Manager. I combined browser-side tracking, server-side tagging via Stape.io, and a Consent Management Platform (CMP) that actually works the way advertisers expect.

⚠️ Why CookieYes Wasn’t Good Enough

The site initially used CookieYes for cookie consent. At first glance, it did the job — it asked for permission and appeared compliant. But there was a big problem:

CookieYes only activated trackers like Meta Pixel and GA4 on the next page view or refresh — even after the user had clicked “Accept All”.

That’s a serious issue if you’re running performance marketing campaigns.

Meta’s ad platform expects a PageView event immediately when the user lands. If it doesn’t get it, Meta won’t attribute that visit to the ad — and your campaigns will struggle to optimize. That’s why I replaced CookieYes with Cookiebot CMP, which allows consent to be handled immediately, even on the first page load.

Step-by-Step GTM Setup

1. Configure Cookiebot CMP in GTM

  • Sign up at Cookiebot
  • In GTM, add the Cookiebot CMP template from the Template Gallery
  • Add your Cookiebot ID
  • Make sure to configure the default consent state based on your legal requirements
  • Check the boxes to enable Google Consent Mode and Enable URL passthrough
  • Use the trigger: Consent Initialization – All Pages
  • Preview and test that consent values update on interaction

2. Add GA4 Base Configuration Tag

  • Create a new GA4 Configuration tag
  • Add your Measurement ID and Server-Side URL
  • Enable consent checks: analytics_storage
  • Trigger on: cookie_consent_update

3. Add Meta Pixel Base Code via Custom HTML

<script>
function getCookie(name) {
  var match = document.cookie.match(new RegExp('(^| )' + name + '=([^;]+)'));
  return match ? match[2] : null;
}

!function(f,b,e,v,n,t,s)
{if(f.fbq)return;n=f.fbq=function(){n.callMethod?
n.callMethod.apply(n,arguments):n.queue.push(arguments)};
if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0';
n.queue=[];t=b.createElement(e);t.async=!0;
t.src=v;s=b.getElementsByTagName(e)[0];
s.parentNode.insertBefore(t,s)}(window, document,'script',
'https://connect.facebook.net/en_US/fbevents.js');

fbq('set', 'autoConfig', 'false', 'YOUR_PIXEL_ID');
fbq('init', 'YOUR_PIXEL_ID');
fbq('track', 'PageView');

window.dataLayer = window.dataLayer || [];
window.dataLayer.push({
  event: 'metaPixelPageView',
  event_id: 'pageview_' + Date.now()
});
</script>

Also include a <noscript> fallback image for browsers with JavaScript disabled.

4. Create GA4 Event Tag to Pass Meta Event

  • Create a GA4 Event with event name: metaPixelPageView
  • Pass event_id and other parameters to sGTM
  • Trigger on: metaPixelPageView data layer event

Server-Side Container with Stape.io

1. Setup Stape.io

  • Create an account at Stape.io
  • Set up a Server-side GTM container
  • Connect a subdomain (e.g., gtm.yourdomain.com)

2. GA4 Tag in Server Container

  • Use the GA4 server-side tag template
  • Trigger on: All GA4 Events

3. Meta Conversion API Tags

  • Create a Meta CAPI tag for each event (PageView, Lead, etc.)
  • Match event_id and event_name with browser tag
  • Trigger on the corresponding GA4 event

Final Thoughts

This setup isn’t easy, but it’s worth it. If you’re running Meta or Google Ads, it’s the best way to ensure accurate data, optimized campaigns, and GDPR compliance. If you’d rather have a team handle the technical setup, we’re here to help.

👉 Contact us below to get started with reliable analytics and server-side tracking.

Need Help?
Reach Out

contact page astronaut

Questions? Reach Out