how to load optional customer id gtag/pixel and etc...

reslear commented 1 week ago

📚 What are you trying to do?

I can't figure out how to load the optional id correctly simple product page to load a consumer id in addition to the main one.

my not working example:

// /product/[id].vue

const consumerGtagId = computed(() => pageData?.gtag)

const {
  gtag,
  proxy: proxyGtag,
  load: loadGtag,
} = useScriptGoogleAnalytics({
  id: '', // without - type error 
  l: 'customer',
  key: 'gtag-customer',
  scriptOptions: {
    // consent ? 
    trigger: 'manual',
  },
})

if (consumerGtagId.value) {
  proxyGtag.gtag('config', consumerGtagId.value as any) // any - because type only `reset` 
  loadGtag()
}

🔍 What have you tried?

No response

ℹ️ Additional context

No response

harlan-zw commented 1 week ago

cc: @huang-julien, @flashdesignory some more gtag issues here if you have any ideas

reslear commented 13 hours ago

hi @huang-julien @flashdesignory Can you help?

huang-julien commented 13 hours ago

Hey :wave: we use TPC to generate the composable and it comes with the config event already set in the inline script property. Currently we're only using id from the options to do it so you can't load an optional id for now.

There's currently a PR with a new templating system in TPC. We can probably try open a PR to make window['gtag-'+(options?.l ?? "dataLayer")]('config',(options?.id )) optional.

cc @flashdesignory

reslear commented 12 hours ago

@huang-julien thanks for the answer!

Yes! That would be great, as some services need the ability to track the statistics of customers/sellers on their pages

nuxt / scripts