Facebook pixel microdata on a single page application

Question

I am trying to create a product catalog on Facebook using their pixel

The docs are here: https://www.facebook.com/business/help/887775018036966

Facebook detects the product information using the microdata (which is a json inside script tag) The problem is that Facebook pixel reads this data automatically and it doesn't happen on a single page application except for the first page.

Is there any way to make Facebook read the microdata manually?

Chao

I am trying to solve the same issue. We can actually do fbq("track", "Microdata") but this sends the microdata from the first page loaded again - there seems to be a cache somewhere but to my great dismay I cannot find it. – Tetracycline

@Chao did you find anything? – Grantor

No. We decided to let go of FB because we didn't find any solution for this – Chao

i've tried fbq('track',Microdata) without success. It fires the event but the products are never added to the catalog – Buffington

Answer 1

Create a new html file for your product page and then set URL redirects to go to that Html then every time someone views a product the FB pixels runs again and automatically detects the microdata

Furious

Thanks for the answer, but doesn't this means I'm leaving the single page? – Chao

Answer 2

I found a way to force it to re-read microdata by adding a listener on routeChange event in next/router and replacing the href property in window.location object

router.events.on("routeChangeStart", (url) => {
   window.location.href = url;
})

Pappus