We have a single page Angular app with the Facebook pixel that is injected via GTM. In the first injection, we pass the following:
<script>
!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('init', '<OUR ID>'); // Insert your pixel ID here.
</script>
Note, there is no pageview event. We then push a custom "virtual pageview" event to the GTM datalayer that leads to a tag that sends the pageview to Google Analytics (working fine), and triggers an injection of the following code as well:
<script>
fbq('track', 'PageView', {
dim1:{{dim 1 macro}},
dim2:{{dim 2 macro}},
dim3:{{dim 2 macro}}
});
</script>
On EACH pageview, the above fbq is appended to the DOM with the proper dimensions populated (by viewing the source of the page).
On the FIRST pageview HIT to Facebook, the dimensions are present in the call (by viewing the network tab), but on the SUBSEQUENT pageviews, a hit is sent to Facebook, BUT no dimensions are sent, even though they are present in the code appended to the DOM.
For the most part, these dimensions do not change hit to hit, but could change based on the actions the user does throughout their sessions.
Any thoughts as to why the subsequent hits DO NOT include the custom dimensions?
Received feedback from the official Facebook team, it seems that this is by design. On any subsequent call with a Pageview event, no custom data will be sent in the payload.