Embed Events

❗️

Only authorized domains are allowed to use this feature.

By enabling cart control, the parent page will receive a window.postMessage with cart and checkout actions, thereby enabling the parent page to handle cart and checkout actions for the user. Listen for events by adding the following code:

window.addEventListener('message', this.handleMessages);

Example of a message handler function

function handleMessages (event) => {
  const { type, value } = event.data
  if (type === 'cartAction') {
    const { action } = value
    
    if (action === 'ADD_TO_CART') {
    	const { variant_id, quantity } = value
      
      // Add custom add to cart function
      
    }
  } else if (type === 'REMOVE_FROM_CART') {
  
    // Add custom remove from cart function
    
  } else if (type === 'UPDATE_QUANTITY') {
    const { variant_id, quantity } = value
    
     // Add custom update quanity function
     
  } else if (type === 'INITIATE_CHECKOUT') {
  
    // Add custom proceed to checkout function
    
  }
 }
}

ADD_TO_CART

Action fires when a product is added to cart. (If provided, the affiliate_id will be TalkShopLive’s affiliate or publisher id that should be included in any add to cart functionality created on the parent page.)
Depending on the product.sub_type and/or product.source , the variant_id will be one of the following:

  • BEST_BUY: variant.sku
  • WALMART: variant.sku (i.e. Walmart Item Id)
  • SHOPIFY: variant.meta.variant_source_id
  • TALKSHOPLIVE: variant.id
data = {
  type: 'cartAction',
  value: {
  	action: 'ADD_TO_CART',
    variant_id: 732283957,
    quantity: 1,
    affiliate_id: 3253036
  }
}

REMOVE_FROM_CART

Action fires when a person removes a line item from their cart.

data = {
  type: 'cartAction',
  value: {
  	action: 'REMOVE_FROM_CART',
    variant_id: 732283957
  }
}

UPDATE_QUANTITY

Action fires when the quantity of a line item is updated.

data = {
  type: 'cartAction',
  value: {
  	action: 'UPDATE_QUANTITY',
    variant_id: 732283957,
    quantity: 2
  }
}

INITIATE_CHECKOUT

Action fires when a person enters the checkout flow prior to completing the checkout flow.

data = {
  type: 'cartAction',
  value: {
  	action: 'INITIATE_CHECKOUT'
  }
}