Recommendations

Clerk.io offre più di 23 diversi tipi di logiche prodotto, rendendo possibile mostrare prodotti completamente automatizzati su qualsiasi pagina. Questo articolo spiega come iniziare quando si utilizza un Clerk.js setup in VTEX.

Per le nostre Best Practice complete, leggi questo articolo su quali Recommendations utilizzare.

Configurazione Slider #

Le Recommendations vengono create con Elements che fanno riferimento a un Design. Di seguito trovi la guida base per configurare un Element.

Seguendo i passaggi in my.clerk.io > Settings > Setup Guides verranno automaticamente creati gli Elements per le nostre Best Practice.

Crea Design #

Di default le Recommendations vengono mostrate come slider. Questo permette ai clienti di visualizzare più prodotti con meno click. Puoi utilizzare il Design Editor per configurarlo visivamente oppure utilizzare code designs.

Un design può essere riutilizzato per un qualsiasi numero di Elements Recommendations che crei.

Puoi usare la Setup Guide sotto Recommendations - Create a design for your recommendations elements per creare rapidamente un Design con la stessa combinazione di colori e stile del tuo webshop.

Clicca su Publish quando sei soddisfatto dello stile.

Puoi facilmente modificarlo in seguito, sotto Recommendations - Designs, e poi clicca sul pulsante modifica.

Crea Element #

Questo contiene tutte le impostazioni utilizzate per mostrare le Recommendations e renderle incorporabili nel tuo sito web. Segui questi passaggi per ogni banner Recommendations che desideri creare.

1. Vai su Recommendations > Elements.
2. Clicca su New Element.
3. Dagli un nome descrittivo. Consigliamo di nominarlo in base alla pagina e alla logica che vuoi usare. Es: “Home Page / Visitor Recommendations”.
4. In Element type, seleziona la logica di prodotto che vuoi usare dal menu a tendina. Puoi vedere una panoramica di tutte le product logics qui.
5. In Design seleziona il design che hai creato dal menu a tendina e scegli il numero di prodotti da mostrare.
6. Clicca su Save in cima allo schermo.

Con la Setup Guide puoi vedere su quali pagine inserire le recommendations e quali tipi utilizzare per avere le nostre Best Practice attive. Ogni passaggio della Setup Guide si concentra su una specifica pagina del webshop e contiene informazioni su:

• Perché le recommendations sono importanti sulla pagina.
• Quali tipi di recommendations utilizzare.
• Dove devono essere posizionate sulla pagina.

Clicca su ogni tipo di recommendations che vuoi utilizzare e segui i passaggi.

Ricorda: semplicemente cliccando su ogni blocco di Recommendations diventeranno verdi come se fossero installati - non lo sono - devi comunque cliccare e seguire i passi.

Aggiungi al Sito Web #

Per aggiungere le Clerk Recommendations sul tuo sito web, devi configurare l’integrazione VTEX.

1. Sul tema del tuo store, aggiungi clerkiopartnerdk.integration-vtex 1.x come peerDependency del tema nel file manifest.json:

"peerDependencies": {
"clerkiopartnerdk.integration-vtex": "1.x"
}

2. Aggiungi il blocco clerkio_recommendations ovunque sul tuo store. Esempio: in home.json

{
  "store.home": {
    "blocks": [
      "responsive-layout.desktop#homepage",
      "responsive-layout.mobile#homepage"
    ]
  },
  "responsive-layout.desktop#homepage": {
    "children": ["clerkio_recommendations"]
  }
}

3. Vai su VTEX Site Editor e nel menu laterale destro verrà visualizzato un blocco ClerkIO. Cliccaci sopra.

4. Compila le informazioni richieste nel blocco:

   • Block Class Name: inserisci un identificativo univoco per il blocco all’interno della pagina su cui viene usato. Es: clerk-product-page-alternatives
   • Template Name: inserisci l’ID fornito da Clerk sull’Element precedentemente creato.
   • Product Logic: scegli la stessa logica raccomandazione dell’Element che hai creato in Clerk.io. Consulta le product logics per le opzioni disponibili.

Pagine #

Di seguito sono elencate le pagine specifiche su cui dovresti inserire le Recommendations e i tipi da utilizzare per seguire le nostre Best Practice.

Homepage #

1. In my.clerk.io, crea 3 Elements con le seguenti logiche:
   • Visitor Recommendations
   • Bestsellers
   • Hot Products
2. Aggiungi il blocco clerkio_recommendations al layout della homepage in VTEX Site Editor.
3. Configura ogni blocco con il Template Name e la Product Logic corretti.

Pagina Categoria #

1. In my.clerk.io, crea un Element con la logica Bestsellers In Category.
2. Aggiungi il blocco clerkio_recommendations al layout della pagina categoria.
3. Configura il blocco con il Template Name e imposta la Product Logic per abbinarla al tuo Element.

Pagina Prodotto #

1. In my.clerk.io, crea 2 Elements con le seguenti logiche:
   • Best Alternative Products
   • Best Cross-Sell Products
2. Aggiungi il blocco clerkio_recommendations al layout della pagina prodotto.
3. Configura ogni blocco con il Template Name e la Product Logic corretti.

Passaggio Aggiungi al Carrello #

1. In my.clerk.io, crea un Element con la logica Best Cross-Sell Products.
2. Assegnagli il nome “Add-To-Basket / Others Also Bought”. Questo è importante affinché l’embedcode funzioni correttamente.
3. Clicca su Save in cima alla pagina.
4. Aggiungi il blocco clerkio_recommendations al passaggio/pagina di aggiunta al carrello.
5. Configura il blocco con il Template Name e la Product Logic.

Pagina Carrello #

1. In my.clerk.io, crea un Element con la logica Best Cross-Sell Products.
2. Aggiungi il blocco clerkio_recommendations al layout della pagina carrello.
3. Configura il blocco con il Template Name e la Product Logic.

Exit Intent #

1. In my.clerk.io, crea un Element con la logica Visitor Recommendations.
2. Aggiungi il blocco clerkio_recommendations al layout globale.
3. Configura il blocco con Template Name e Product Logic, e impostalo per attivarsi su exit intent.

Template di Partenza #

Se desideri utilizzare code designs, questi template ti aiuteranno a iniziare.

Slider Code #

Questo template mostrerà uno slider standard con diverse informazioni prodotto, che puoi adattare alle tue esigenze.