Facebook Pixel ID集成Shopify Customer Event

!(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', PIXELID, {}, { agent: 'shopify_custom_pixel' });

const DEFAULT_VARIANT_TITLE = ['default', 'title', 'default title', ''];

function sendEvent(eventName, eventId, eventMetaData = {}) {
  fbq('track', eventName, eventMetaData, { eventID: eventId });
}

function getCheckoutContentIds(event) {
  let content_ids = [];
  const items = event.data?.checkout?.lineItems;
  if (items != null) {
    for (const item of items) {
      const id = item.variant?.id || item.variant?.sku || item.variant?.product?.id;
      if (id != null) {
        content_ids.push(parseInt(id));
      }
    }
  }
  return content_ids;
}

function getCheckoutContentType(event) {
  const items = event.data?.checkout?.lineItems;
  if (items != null) {
    for (const item of items) {
      if (item.variant?.id || item.variant?.sku) {
        return 'product';
      }
    }
  }
  return 'product_group';
}

function getCheckOutNumItems(event) {
  let num_items = 0;
  const items = event.data?.checkout?.lineItems;
  if (items != null) {
    for (const item of items) {
      num_items += item.quantity || 1;
    }
  }
  return num_items;
}

function getContentNameFilterOutDefault(product_title, variant_title) {
  if (
    variant_title === null ||
    variant_title === undefined ||
    DEFAULT_VARIANT_TITLE.includes(variant_title.toLowerCase())
  ) {
    return product_title || '';
  }
  return product_title + ' - ' + variant_title;
}

analytics.subscribe('page_viewed', (event) => {
  sendEvent('PageView', event.id);
});

analytics.subscribe('search_submitted', (event) => {
  const search_string = event.data?.searchResult?.query || '';
  sendEvent('Search', event.id, { search_string });
});

analytics.subscribe('product_viewed', (event) => {
  const id =
    event.data?.productVariant?.id ||
    event.data?.productVariant?.sku ||
    event.data?.productVariant?.product?.id;
  const content_ids = id ? [parseInt(id)] : [];
  const content_type =
    event.data?.productVariant?.id || event.data?.productVariant?.sku ? 'product' : 'product_group';
  const content_name = getContentNameFilterOutDefault(
    event.data?.productVariant?.product?.title,
    event.data?.productVariant?.title
  );
  const content_category = event.data?.productVariant?.product?.type || '';
  const currency = event.data?.productVariant?.price?.currencyCode || 'USD';
  const value = event.data?.productVariant?.price?.amount;

  sendEvent('ViewContent', event.id, {
    content_ids,
    content_type,
    content_name,
    content_category,
    currency,
    value,
  });
});

analytics.subscribe('product_added_to_cart', (event) => {
  const id =
    event.data?.cartLine?.merchandise?.id ||
    event.data?.cartLine?.merchandise?.sku ||
    event.data?.cartLine?.merchandise?.product?.id;
  const content_ids = id ? [parseInt(id)] : [];
  const content_type =
    event.data?.cartLine?.merchandise?.id || event.data?.cartLine?.merchandise?.sku ? 'product' : 'product_group';
  const content_name = getContentNameFilterOutDefault(
    event.data?.cartLine?.merchandise?.product?.title,
    event.data?.cartLine?.merchandise?.title
  );
  const content_category = event.data?.cartLine?.merchandise?.product?.type || '';
  const currency = event.data?.cartLine?.merchandise?.price?.currencyCode || 'USD';
  const value = event.data?.cartLine?.merchandise?.price?.amount;
  const num_items = event.data?.cartLine?.quantity || 1;

  sendEvent('AddToCart', event.id, {
    content_ids,
    content_type,
    content_name,
    content_category,
    currency,
    value,
    num_items,
  });
});

analytics.subscribe('checkout_started', (event) => {
  const content_ids = getCheckoutContentIds(event);
  const content_type = getCheckoutContentType(event);
  const currency = event.data?.checkout?.currencyCode || 'USD';
  const value = event.data?.checkout?.subtotalPrice?.amount;
  const num_items = getCheckOutNumItems(event);

  sendEvent('InitiateCheckout', event.id, {
    content_ids,
    content_type,
    currency,
    value,
    num_items,
  });
});

analytics.subscribe('checkout_completed', (event) => {
  const content_ids = getCheckoutContentIds(event);
  const content_type = getCheckoutContentType(event);
  const currency = event.data?.checkout?.currencyCode || 'USD';
  const value = event.data?.checkout?.totalPrice?.amount;
  const num_items = getCheckOutNumItems(event);

  sendEvent('Purchase', event.id, {
    content_ids,
    content_type,
    currency,
    value,
    num_items,
  });
});

analytics.subscribe('payment_info_submitted', (event) => {
  const currency = event.data?.checkout?.currencyCode || 'USD';
  const value = event.data?.checkout?.totalPrice?.amount;
  sendEvent('AddPaymentInfo', event.id, { currency, value });
});