Recommendations

Clerk.io offre più di 23 diversi tipi di logiche di 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 Practices complete, leggi questo articolo su quali Recommendations utilizzare.

Configurazione Slider #

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

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

Crea Design #

Le Recommendations vengono visualizzate come uno slider per impostazione predefinita. Questo permette ai clienti di vedere più prodotti con meno clic. Puoi usare il Design Editor per configurarlo visivamente, o usare code designs.

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

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

Clicca Publish quando sei soddisfatto dello stile.

Puoi facilmente modificare questa scelta in seguito, sotto Recommendations - Designs, e poi facendo clic sul pulsante di modifica.

Crea Element #

Questo contiene tutte le impostazioni utilizzate per visualizzare le Recommendations, e renderle incorporabili nel tuo sito web. Segui questi passaggi per ogni banner Recommendations che vuoi 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 utilizzare. Es. “Home Page / Visitor Recommendations”.
4. In Element type, seleziona la logica di prodotto che vuoi utilizzare dal menu a tendina. Puoi vedere una panoramica di tutte le product logics qui.
5. In Design seleziona il design creato dal menu a tendina e scegli il numero di prodotti da mostrare.
6. Clicca Save in alto nella schermata.

Con la Setup Guide, puoi vedere su quali pagine installare le recommendations e quali tipi usare per attivare la nostra Best Practice. 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 posizionarle sulla pagina.

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

Attenzione: solo cliccando su ciascun blocco di Recommendations diventeranno verdi come se fossero installate - ma non lo sono - devi comunque cliccare e seguire i passaggi.

Aggiungi al Sito Web #

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

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

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

2. Aggiungi il blocco clerkio_recommendations ovunque nel 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 a destra verrà visualizzato un blocco ClerkIO. Cliccaci sopra.

4. Compila le informazioni richieste nel blocco:
   • Block Class Name: inserisci un identificatore univoco per il blocco nella pagina in cui è utilizzato. Es. clerk-product-page-alternatives
   • Template Name: inserisci l’ID fornito da Clerk sull’Element creato in precedenza.
   • Product Logic: abbina la recommendation logic a quella specificata sull’Element creato in precedenza su Clerk. Le logiche prodotto disponibili sono:

Pagine #

Di seguito sono riportate le pagine specifiche dove dovresti inserire le Recommendations e quali tipi usare, per seguire le nostre Best Practices.

Homepage #

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

Category Page #

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

Product Page #

1. Su 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 tua product page.
3. Configura ogni blocco con il correttto Template Name e Product Logic.

Add-To-Basket Step #

1. Su my.clerk.io, crea un Element con la logica Best Cross-Sell Products.
2. Dagli il nome “Add-To-Basket / Others Also Bought”. Questo è importante per far funzionare correttamente l’embedcode.
3. Clicca su Save in alto nella pagina.
4. Aggiungi il blocco clerkio_recommendations al passaggio/pagina add-to-basket.
5. Configura il blocco con il Template Name e Product Logic.

Cart Page #

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

Exit Intent #

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

Starting Templates #

Se vuoi usare dei code designs, questi template possono aiutarti a iniziare.

Slider Code #

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