Forward browser events to Google Analytics

Listen to Cevoid browser events and forward them into GA4 or GTM without duplicating gallery tracking calls.

Use this page when you already use Cevoid galleries or cards and want their emitted browser events in GA4 or GTM. If you need to manually send Cevoid widget events from custom code, use Manual event tracking instead.

Default gallery behavior

Cevoid galleries and cards use the UGC tracking surface internally and emit browser CustomEvent⁠s by default.

That means you usually do not need to call trackEvent() yourself just to forward gallery interactions to GA.

The browser event name format is:

cevoid:<event-name>

Examples:

cevoid:widget.load
cevoid:post.click
cevoid:product.click.tag
cevoid:gallery.load_more
cevoid:sale.complete

The forwarded payload is available on event.detail⁠.

window.addEventListener('cevoid:post.click', (event) => {
  console.log(event.detail)
})

Browser events are emitted when the SDK tracking call runs unless emitBrowserEvents is disabled.

Consent affects whether the SDK stores the Cevoid session in the ca_session cookie. It does not prevent the browser CustomEvent⁠ itself from being emitted.

Option 1: forward directly with `gtag`

Use this when GA4 is installed directly with gtag().

<script>
  window.addEventListener('cevoid:post.click', function (event) {
    gtag('event', 'cevoid_post_click', {
      widget_id: event.detail.widgetId,
      widget_type: event.detail.widgetType,
      post_id: event.detail.postId,
      post_position: event.detail.postPosition
    })
  })
</script>

Option 2: forward through GTM

Use this when your site already routes analytics through Google Tag Manager.

<script>
  window.addEventListener('cevoid:post.click', function (event) {
    window.dataLayer = window.dataLayer || []
    window.dataLayer.push({
      event: 'cevoid_post_click',
      cevoid_event_name: 'post.click',
      ...event.detail
    })
  })
</script>

Then in GTM:

Create a Custom Event trigger for cevoid_post_click
Create a GA4 Event tag
Map the pushed fields to GA4 parameters

Recommended events to forward

Start with the lower-volume action events that are easiest to report on:

Forward impression-style events like widget.view or post.view only if you want that extra volume in GA.

Example: forward multiple events

<script>
  const cevoidEvents = [
    'post.click',
    'product.click.tag',
    'gallery.load_more',
    'gallery.upload_cta_click'
  ]

  cevoidEvents.forEach((name) => {
    window.addEventListener(`cevoid:${name}`, function (event) {
      gtag('event', `cevoid_${name.replace(/\./g, '_')}`, {
        cevoid_event_name: name,
        ...event.detail
      })
    })
  })
</script>

Example: only forward one gallery

<script>
  window.addEventListener('cevoid:post.click', function (event) {
    if (event.detail.widgetId !== 'gallery-homepage') {
      return
    }

    gtag('event', 'cevoid_post_click', {
      widget_id: event.detail.widgetId,
      post_id: event.detail.postId
    })
  })
</script>