Contesto della pagina per l'implementazione lato client

Esempio di homepage:

/**
* @param {string} type
* @param {string[]} data
*/
export function setDYContext(type, data) {
  window.DY = window.DY || {};
  DY.recommendationContext = { type: type, data: data };
}  
      
export default function HomePage() {
  //...
  useEffect(() => setDYContext('HOMEPAGE'));
  return (
  //...
  )

Esempio di pagina di prodotto:

/**
* @param {string} type
* @param {string[]} data
*/
export function setDYContext(type, data) {
  window.DY = window.DY || {};
  DY.recommendationContext = { type: type, data: data };
 }

export default function ProductPage(props) {
  // ...
  useEffect(() => setDYContext('PRODUCT', [ props.sku ]), [ props.sku ]);
  
  return {
  // ...
  )

Esempio di homepage:

/**
* @param {string} type
* @param {string[]} data
*/
export function setDYContext(type, data) {
  window.DY = window.DY || {};
  DY.recommendationContext = { type: type, data: data };
}

export default class HomePage extends React.Component{
  //...
  
  componentDidMount() {
  setDYContext('HOMEPAGE');
  }
  
  render() {
  return {
  //...
  )
  }
}

Esempio di pagina di prodotto:

/**
* @param {string} type
* @param {string[]} data
*/
export function setDYContext(type, data) {
  window.DY = window.DY || {};
  DY.recommendationContext = { type: type, data: data };
}

export default class ProductPage extends React.Component{
  constructor(props) {
  super(props);
  this.state = { sku: props.sku }
  }
  //...
  
  componentDidMount() {
  setDYContext('PRODUCT', [ this.props.sku ]);
  }
  
  componentDidUpdate(prevProps) {
  if (prevProps.sku !== this.props.sku) {
  setDYContext('PRODUCT', [ this.props.sku ]);
  }
  }
  render() {
  return(
  //...
  )
  }

<script type="text/javascript">
  window.DY = window.DY || {}; 
  dy.recommendationContext = { type: "PRODUCT", data: ['SKU123'] };// in questo esempio: una pagina di prodotto 
</script>

<script type="text/javascript">
  window.DY = window.DY || {}; 
  dy.recommendationContext = { type: "POST", data: ['POST_ID123'] };// in questo esempio: una pagina di pubblicazione 
</script>

Di seguito sono indicati degli esempi di espressioni regolari per il contesto su ognuno di questi tipi di pagina: 

Homepage

L'espressione regolare (regex) aggiunta in questa regola di contesto è una stringa aggiunta alla fine dell'URL della home page: www.mysite.com/[REGEX], dove il tag [REGEX] viene sostituito con qualsiasi espressione tu voglia usare. Tieni presente che non può esserci testo aggiuntivo dopo l'espressione. 

Esempio: 

Espressione: /\w{2}\/\w{2}\/$ (URL is www.mysite.pl/\w{2}\/\w{2}\/$)

Questa regola trova l'URL: www.mysite.com/pl/pl/

Questa regola non trova l'URL: www.mysite.com/pl/pl/new-in/men

Pagina di prodotto

Per impostare un'espressione regolare per il contesto di una pagina di prodotto, ci sono due parti: Definisci il tipo di pagina (imposta il targeting del prodotto) e definisci la posizione dello SKU (imposta la regola del contesto):

Nell'area Definisci il tipo di pagina, seleziona il contesto regex, quindi aggiungi l'espressione (dove nell'esempio viene visualizzato [my regex]. 

Esempio:

Espressione: *[a-zA-Z0-9_]{5}-[a-zA-Z0-9_]{3}. *

Questa regola trova tutte le pagine con una struttura SKU che soddisfa le condizioni incluse, come questo URL:

www.mysite.com/pl/pl/4270h-00x/opaska-na-wl-re

Successivamente, imposta dove si trova lo SKU nella pagina di prodotto. In questo esempio, il valore SKU è preso dal [0]dataLayer.sku (sulla pagina). Gli oggetti possono essere usati nelle regole regex se sono disponibili dalla finestra globale.

Pagina del carrello

L'URL del carrello è univoco. Ad esempio, questo URL: https://www.mysite.com/pl/pl/checkout/cart/ è l'unico URL del sito con la stringa /checkout/cart. Pertanto, non è necessaria alcuna regola regex. Il tipo di pagina può essere rilevato utilizzando il parametro URL.