Componente di Raccomandazioni di Prodotti

Funzionalità del componente di raccomandazione di prodotti all'interno del Creative Editor di Fanplayr.

Esempi

Esempio di componente di raccomandazioni.

L'icona del componente di raccomandazioni.

Concetti

Concetti di alto livello relativi a questo componente:

• Visualizza un elenco di prodotti in una griglia
  Il numero di prodotti mostrati si basa sulla quantità di spazio disponibile e sulla dimensione del modello di prodotto definito.
• Modello di prodotto
  Lo stile degli elementi nell'elenco è controllato dal modello di prodotto. Ciò consente agli utenti di progettare la dimensione complessiva di un prodotto, così come la sua immagine, il testo e la call to action.
• Navigazione dell'elenco
  Le frecce di navigazione sinistra e destra appariranno se ci sono più prodotti da mostrare.
• Cliccando sui prodotti
  Quando un utente clicca su un prodotto, il suo browser viene indirizzato alla pagina del prodotto corrispondente. Questa azione viene anche tracciata in Insights.
• La presentazione del widget dipende da questo componente
  Quando un componente di raccomandazioni viene utilizzato in un widget, il widget attenderà che le raccomandazioni di prodotti vengano restituite dal servizio prima di visualizzare il widget.

La struttura del componente e il layout della griglia del modello di prodotto.

La struttura e il layout del Modello di Prodotto

Proprietà generali

Queste proprietà controllano quale modello AI di raccomandazione viene utilizzato e quanti prodotti vengono richiesti dal servizio di raccomandazione.

Tipo di raccomandazione

• Tipo: Modello AI di Raccomandazione

Il modello AI di raccomandazione da utilizzare:

• Modelli generali:

  • Spesso Acquistati Insieme
  • Altri Che Potrebbero Piacerti
  • Consigliato Per Te
  • Visti Di Recente

• Modelli di classificazione dei prodotti:

  • Classificati per Visualizzazioni
  • Classificati per Carrelli
  • Classificati per Acquisti
  • Classificati per Entrate

Nota: Solo i modelli abilitati sul tuo account e che hanno completato l'addestramento saranno disponibili per la selezione.

Prodotti minimi

• Tipo: Intero

Il numero minimo di prodotti richiesti. Questo può essere utilizzato per garantire che almeno un certo numero di prodotti sia disponibile per il rendering dal modello AI di raccomandazione. Se il servizio di raccomandazione non è in grado di restituire abbastanza prodotti, il widget non verrà visualizzato.

INFO

Per i modelli AI diversi da Visti di Recente, si consiglia di utilizzare un minimo di 5 o più prodotti per garantire che ci sia abbastanza contenuto coinvolgente da mostrare agli utenti.

Prodotti massimi

• Type: Intero

Il numero massimo di prodotti da richiedere al servizio.

Questo valore è solo un numero suggerito di prodotti che il servizio dovrebbe interrogare e non vi è alcuna garanzia che questo numero massimo di prodotti verrà restituito. Suggeriamo di mantenere il numero massimo al di sotto di 30 per ridurre i tempi di risposta delle query.

Numero di giorni

• Type: Intero
• Si applica a: Solo raccomandazioni di classificazione dei prodotti

Il numero di giorni di cronologia da utilizzare quando si interrogano i prodotti più classificati, a partire da oggi. I valori validi sono compresi tra 1 e 30, dove "1" interrogherà fino alle ultime 24 ore di dati e "2" interrogherà fino alle ultime 48 ore di dati, ecc.

Prezzo iniziale

• Type: Intero
• Si applica a: Solo raccomandazioni di classificazione dei prodotti

Limita i risultati solo ai prodotti il cui prezzo è maggiore o uguale al prezzo iniziale. Lasciare vuoto per nessun limite.

Prezzo finale

• Type: Intero
• Si applica a: Solo raccomandazioni di classificazione dei prodotti

Limita i risultati solo ai prodotti il cui prezzo è inferiore o uguale al prezzo finale. Lasciare vuoto per nessun limite.

Categoria

• Type: Testo
• Si applica a: Solo raccomandazioni di classificazione dei prodotti

Limita i risultati solo ai prodotti del nome di categoria specificato. Questo può anche essere configurato per utilizzare la categoria della pagina corrente.

Proprietà del prodotto

Queste proprietà si riferiscono alle dimensioni complessive di un prodotto.

Larghezza

• Type: Dimensione (pixel)

La larghezza di un singolo prodotto.

Il componente utilizzerà la sua larghezza complessiva e la larghezza del prodotto per determinare quanti prodotti possono essere visualizzati contemporaneamente. Tutti i prodotti rimanenti saranno nascosti e all'utente verranno mostrati i pulsanti freccia per navigare nell'elenco.

Ad esempio, se il componente è largo 800px e la larghezza del prodotto è 150px, possono essere mostrati fino a 5 prodotti contemporaneamente.

Altezza

• Type: Dimensione (pixel)

L'altezza di un singolo prodotto.

Il componente utilizzerà la sua altezza complessiva e l'altezza del prodotto per determinare quante righe di prodotti possono essere mostrate.

Ad esempio, se il componente è alto 500px e l'altezza del prodotto è 200px, possono essere mostrate fino a 2 righe di prodotti se necessario.

Spazio

• Type: Dimensione (pixel)

La quantità minima di spaziatura per circondare ogni prodotto. Questo viene utilizzato per aggiungere separazione tra prodotti adiacenti nell'elenco o nelle righe.

Bordo

• Type: Bordo

Stile di bordo standard.

Raggio del bordo

• Type: Raggio del bordo

Stile di raggio del bordo standard.

Sfondo

• Type: Colore

Il colore di sfondo del prodotto.

X-Padding

• Type: Dimensione (pixel)

Aggiunge spaziatura orizzontale ai bordi del componente, utilizzata per spingere la griglia del prodotto verso il centro.

Proprietà dell'immagine

Altezza

• Type: Dimensione (pixel)

L'altezza dell'immagine.

L'immagine occuperà sempre la larghezza completa del prodotto, ma l'altezza dell'immagine è regolabile.

Sfondo

• Type: Colore

Il colore di sfondo da utilizzare per eventuali parti trasparenti dell'immagine del prodotto.

Dimensione dello sfondo

• Type: Dimensione dello sfondo

Stile di dimensione dello sfondo standard. Controlla se l'immagine viene ridimensionata per occupare tutto lo spazio disponibile (potenzialmente tagliando parte dell'immagine) o ridotta per garantire che tutta l'immagine sia visibile.

Proprietà della descrizione

Testo

• Type: Testo ricco

Elemento di testo che consente ricche opzioni di personalizzazione. Supporta le seguenti variabili che possono essere aggiunte utilizzando l'azione Inserisci Variabile:

• {{ productRec.name }} - Il nome del prodotto attuale.
• {{ productRec.price }} - Il prezzo del prodotto attuale, incluso il simbolo della valuta.
• {{ productRec.url }} - L'URL del prodotto attuale.
• {{ productRec.rank }} - La classifica del prodotto attuale. Es. 1, 2, 3.

Loading embed...

Dimostrazione dell'aggiunta di variabili di prodotto al componente.

Dimostrazione dell'aggiunta di variabili di prodotto al componente.

Margine

• Type: Margine

Spaziatura da aggiungere all'esterno dell'area di testo. Questo aggiunge spazio tra l'immagine e il pulsante.

Proprietà del pulsante

Mostra

• Type: Booleano

Se mostrare o nascondere il pulsante di call to action.

Margine

• Type: Margine

Spaziatura da aggiungere all'esterno del pulsante. Questo aggiunge spaziatura dal testo del prodotto sopra il pulsante.

Riempimento

• Type: Riempimento

Spaziatura da aggiungere all'interno del pulsante.

Bordo

• Type: Bordo

Stile di bordo standard.

Raggio del bordo

• Type: Raggio del bordo

Stile di raggio del bordo standard.

Testo

• Type: Testo ricco

Testo del pulsante. Supporta le stesse variabili di Testo della Descrizione.

Colore del testo

• Type: Colore

Colore del testo del pulsante.

Sfondo

• Type: Colore

Colore di sfondo del pulsante.

Proprietà del pulsante di navigazione

Questi pulsanti appaiono sul lato sinistro e destro del componente quando ci sono più prodotti da mostrare di quanti possano essere visualizzati.

La struttura del pulsante di navigazione (mostrato il pulsante destro).

Bordo

• Type: Bordo

Stile di bordo standard.

Raggio del bordo

• Type: Raggio del bordo

Stile di raggio del bordo standard. (Suggerimento: Imposta il raggio al 50% per rendere il pulsante un cerchio)

Riempimento

• Type: Riempimento

Spaziatura da aggiungere all'interno del pulsante.

Offset-X

• Type: Dimensione (pixel)

Spaziatura orizzontale da aggiungere tra il pulsante di navigazione e il bordo del componente.

Sfondo

• Type: Colore

Colore di sfondo del pulsante.

Dimensione freccia

• Type: Dimensione (pixel)

La dimensione complessiva della freccia.

Larghezza freccia

• Type: Dimensione (pixel)

Lo spessore della freccia.

Colore freccia

• Type: Colore

Il colore della freccia.