Customer Events Pixel Code

If your Shopify version supports web pixels go to “Settings -> Customer events” and click the “Add custom pixel”. Give the new pixel a name like “Videowise Pixel” and add the following pixel code:

Customer Events Pixel Code
// VIDEOWISE TRACKING PIXEL
const PIXEL_VERSION = "1.4";
const UID_COOKIE_NAME = "reeview_uid";
const CAMPAIGN_COOKIE_NAME = "reeview_campaign";
const LS_COOKIE_NAME = "reeview_lsid";
function setSessionCookie(name, value) {
  document.cookie = `${name}=${value}; path=/`;
}
function getCookie(name) {
  let cookieArr = document.cookie.split(";");
  for (let i = 0; i < cookieArr.length; i++) {
    let cookiePair = cookieArr[i].split("=");
    if (name === cookiePair[0].trim()) {
      return decodeURIComponent(cookiePair[1]);
    }
  }
  return null;
}
function deleteCookie(name) {
  document.cookie = name + "=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;";
}

function VW(orderId, orderTotal, orderCurrency, orderItems, shop) {
  const getDeviceType = () => {
    const size = 1024;
    const isDesktop = window.screen.width > size;
    return isDesktop ? "DESKTOP" : "MOBILE";
  };

  if (getCookie(UID_COOKIE_NAME) && shop && orderId && orderTotal) {
    const clientTs = new Date();
    const trackingUrl = `https://api.videowise.com/tracking/pixel?uid=${getCookie(
      UID_COOKIE_NAME
    )}&deviceType=${getDeviceType()}&orderId=${orderId}&shop=${shop}&checkout_type=SHOPIFY&order_total=${orderTotal}&currency=${orderCurrency}&order_items=${orderItems}&campaignId=${getCookie(
      CAMPAIGN_COOKIE_NAME
    )}&lsId=${getCookie(LS_COOKIE_NAME)}&clientTs=${clientTs.toISOString()}`;
    fetch(trackingUrl).then((res) => {
      console.log(
        `Videowise pixel (version: ${PIXEL_VERSION}) executed correctly`
      );
      deleteCookie(CAMPAIGN_COOKIE_NAME);
    });
  }
}

analytics.subscribe("checkout_completed", (event) => {
  const checkout = event.data.checkout;
  VW(
    checkout.order.id,
    checkout.totalPrice.amount,
    checkout.currencyCode,
    checkout.lineItems.length,
    event.context.window.location.host
  );
});

analytics.subscribe("page_viewed", (event) => {
  if (!event.context.window.location.search.includes("videowise_campaign_id")) {
    console.log("Videowise no campaign cookie detected");
    return;
  }
  const vars = new URLSearchParams(event.context.window.location.search);
  const campaignId = vars.get("videowise_campaign_id");
  if (campaignId) {
    setSessionCookie(CAMPAIGN_COOKIE_NAME, campaignId);
  }
});

You don’t need to create a custom pixel if the Videowise Pixel was automatically created and shows as “Connected”

Checkout Page Pixel Code

If your Shopify version does not support web pixels, you have to add the following code in the “Settings -> Checkout -> Order status page”

Order status pixel code
<!--VIDEOWISE TRACKING PIXEL-->
<script>
(function() {
  // make sure the initial conversion isn't tracked twice
  {% if first_time_accessed == false %}
    return;
  {% endif %}

  var orderId = '{{ order_id }}';
  var orderTotal = '{{ subtotal_price | divided_by: 100.0 }}';
  var orderCurrency = '{{ currency }}';
  var orderItems = '{{ line_items.size }}';
  var shop = '{{ shop.permanent_domain }}';

  const getCookie = () => {
    const value = `; ${document.cookie}`;
    const parts = value.split(`reeview_uid=`);
    if (parts.length === 2) return parts.pop().split(";").shift();
  };
  const getDeviceType = () => {
    const size = 1024;
    const isDesktop = window.screen.width > size;
    return isDesktop ? "DESKTOP" : "MOBILE";
  };
  if (getCookie() &&shop && orderId && orderTotal) {
    const trackingUrl = `https://api.videowise.com/tracking/pixel?uid=${getCookie()}&deviceType=${getDeviceType()}&orderId=${orderId}&shop=${shop}&checkout_type=SHOPIFY&order_total=${orderTotal}&currency=${orderCurrency}&order_items=${orderItems}`;
    fetch(trackingUrl).then(res=>{console.log("Videowise pixel executed correctly");})
  }
})();
</script>