Amplitude events into Optimizely Web

Fire an Amplitude event and watch the Optimizely custom event it becomes — the allowlist, the revenue conversion to integer cents, and the full push payload.

Browser · Amplitude Browser SDK 2 enrichment plugin

Test siteAmplitude and Optimizely Web are both installed on this page

Left pane

shop.example.com

Footwear · Running

Trailhead 114

A stand-in storefront. Each button below emits a real Amplitude event through the forwarding plugin — no account, no key, nothing leaves your browser.

€54.99

The full case: an allowlisted event carrying revenue, a quantity and three descriptive fields.

Other events this site emits

What just happenedNothing yet — fire an event on the left

Right pane

The inspector is idleEvery event is matched against the allowlist. Allowlisted events become an Optimizely custom event; anything else is dropped — silently, on a real site.

The code this page runs

Optimizely docs ↗

Full write-up: /web-experimentation/integrations/forward-amplitude-events

import * as amplitude from '@amplitude/analytics-browser';

// Amplitude event name -> Optimizely custom event API name
const FORWARDED_EVENTS = {
  'Checkout Completed': 'purchase_completed',
  'Add To Cart': 'add_to_cart',
  'Newsletter Signup': 'newsletter_signup',
};

const optimizelyForwarder = {
  name: 'optimizely-forwarder',
  type: 'enrichment',

  async setup() {
    window['optimizely'] = window['optimizely'] || [];
    return undefined;
  },

  async execute(event) {
    const eventName = FORWARDED_EVENTS[event.event_type];
    if (!eventName) return event;

    const properties = event.event_properties || {};

    const tags = {};
    if (typeof properties.revenue === 'number') {
      // Optimizely records revenue in cents, as an integer.
      tags.revenue = Math.round(properties.revenue * 100);
    }
    if (typeof properties.quantity === 'number') {
      tags.value = properties.quantity;
    }

    window['optimizely'].push({
      type: 'event',
      eventName: eventName,
      tags: tags,
      properties: {
        Category: properties.category,
        Subcategory: properties.subcategory,
        SKU: properties.sku,
      },
    });

    // An enrichment plugin must return the event, or the SDK drops it.
    return event;
  },
};

amplitude.add(optimizelyForwarder);
amplitude.init('YOUR_AMPLITUDE_API_KEY');