Come personalizzare l’aspetto del tuo chatbot

Shoply AI Chat e AI Search offrono più di 40 opzioni per personalizzare l’aspetto dell’app.

Questa sezione ti guida attraverso le diverse opzioni di personalizzazione disponibili per il tuo AI Chatbot. Puoi personalizzarne l’aspetto, il design della finestra di chat e l’esperienza di messaggistica per adattarli al tuo brand.

Pronto per iniziare? Apri Customize AI Chat nella tua Shoply AI Admin Console, sia che tu utilizzi Shopify o un’altra piattaforma per siti web. Se il chatbot non è ancora visibile, segui la checklist di installazione e visibilità.

Anteprima della tua finestra di chat

Prova lo stesso tema e le illustrazioni con larghezza desktop utilizzati nell’admin. Scegli un aspetto chiaro o scuro e confronta quanto spazio occupa la finestra di chat.

Per cambiare il modo in cui l’AI parla invece di come appare, consulta come personalizzare la personalità della tua AI.

Scelta dell’icona della chat

Select an icon

Puoi scegliere un’icona della chat tra le nostre 17 icone predefinite diverse, oppure caricare un’immagine come tua icona personalizzata della chat

Colore e dimensione dell’icona della chat

Primary Color

Questo è il colore principale del tema, ed è utilizzato anche come colore del testo evidenziato nella finestra di chat.

Se utilizzi una modalità chiara sul tuo sito web, seleziona un colore non bianco come colore del tema — questo serve a garantire che il testo evidenziato resti leggibile sullo sfondo chiaro. Se utilizzi una modalità scura sul tuo sito web, seleziona un colore non nero come colore del tema.

Complementary Color

Questo è un colore complementare che lavora insieme al tuo colore principale per creare sfumature (transizione morbida tra due colori) per l’icona della chat e l’intestazione della finestra di chat, rendendo l’icona della chat più accattivante dal punto di vista visivo e in linea con il tuo brand.

Icon’s Line Color

Questo è il colore del contorno dell’icona della chat.

Whether to remove the background color of the chat icon.

Questo è spesso utile se carichi un’immagine come icona della chat e desideri rimuovere il colore di sfondo (il colore principale) dell’icona della chat.

Whether to remove the shadow of the chat icon.

Questa opzione ti consente di rimuovere l’effetto ombra esterna dall’icona della chat per un design più piatto e minimalista. È particolarmente utile se il tuo negozio ha un’estetica pulita e moderna, oppure se hai caricato un’icona personalizzata che include già i propri effetti di ombra o profondità.

Floating Icon Size for desktop and mobile.

Su mobile, potresti voler impostare una dimensione più piccola per l’icona della chat per evitare che ostacoli la visuale del cliente sullo schermo del dispositivo.

Posizionamento dell’icona della chat

Chat icon positioning’s on desktop and on mobile.

Z-index of Chat Icon:

Usa un valore più alto se vuoi che l’icona resti davanti ad altri elementi dell’interfaccia.

Auto-hide chat icon on mobile

Nascondi l’icona della chat dopo un numero specificato di secondi sui dispositivi mobili.

Questa opzione è disponibile solo per i dispositivi mobili. Aiuta a evitare che l’icona della chat ostacoli la visuale del cliente sullo schermo del dispositivo.

Personalizzazione della finestra di chat

Quando fai clic sull’icona della chat di Shoply AI, la finestra di chat si aprirà. I clienti possono interagire con Shoply AI tramite quella finestra di chat.

Questa sezione ti guiderà attraverso le diverse opzioni disponibili per personalizzare la finestra di chat.

Color Theme (dark mode or light mode) of the chat window

Se scegli la modalità scura, lo sfondo della finestra di chat sarà nero e il colore del testo sarà bianco. Ti consigliamo di adottare l’opzione modalità scura se anche il tema del tuo negozio è in modalità scura.

Width of the chat window on desktop

Questa opzione si applica solo al desktop. Su mobile, la finestra di chat occupa sempre l’intero schermo.

Select the branding image and background image

Puoi scegliere di caricare la tua immagine di branding e l’immagine di sfondo per la finestra di chat, oppure lasciare semplicemente che Shoply AI generi queste immagini per te.

Se scegli di utilizzare l’immagine generata dall’AI, Shoply AI genererà le immagini di branding e le immagini di sfondo in base alla descrizione del tuo negozio.

Adjust the transparency and aspect ratios of the background image for the chat window.

Le immagini di sfondo nella finestra di chat potrebbero rendere il testo sovrapposto non leggibile. Per questo motivo, per impostazione predefinita, aggiungiamo un livello semitrasparente sopra l’immagine di sfondo.

Whether to remove Shoply AI’s Logo in Input Bar

Questa opzione ti consente di rimuovere il logo Shoply AI dalla barra di input della chat per un’esperienza più pulita e più coerente con il tuo brand. È particolarmente utile se vuoi mantenere un’identità di brand uniforme in tutto il tuo negozio senza loghi di terze parti, oppure se preferisci un design dell’interfaccia della chat più minimalista.

Questa opzione è disponibile solo per i piani a pagamento.

Messaggi predefiniti per AI Chat

Puoi anche impostare o modificare i messaggi predefiniti che guidano i clienti quando interagiscono per la prima volta con il tuo chatbot. Inoltre, puoi configurare le opzioni di traduzione per questi messaggi (consulta questa pagina FAQ per maggiori dettagli).

Popup Welcome message (shows above chat icon if not empty)

Se lasci vuoto il messaggio di benvenuto, non mostreremo il messaggio di benvenuto sopra l’icona della chat.

Pre-defined messages in chat window

Puoi impostare fino a 3 tipi di messaggi predefiniti nella finestra di chat:

1. Primo messaggio nella finestra di chat - Questo è il messaggio di saluto iniziale che appare automaticamente quando i clienti aprono per la prima volta la finestra di chat. Usalo per dare il benvenuto ai clienti e impostare il tono della conversazione.

2. Fino a 4 domande iniziali - Sono suggerimenti di domande cliccabili visualizzati all’inizio della chat. Aiutano a guidare i clienti fornendo domande comuni su cui possono fare clic per iniziare una conversazione, rendendo più facile cominciare.

3. Messaggio segnaposto dell’input - Questo è il testo di suggerimento che appare nel campo di input della chat prima che i clienti inizino a digitare. Fornisce indicazioni su ciò che i clienti possono chiedere, ad esempio “Ask me anything 🤗” oppure “How can I help you today?”

Queste impostazioni controllano l’apertura standard della chat. Quando un acquirente apre la chat tramite un link “Question About This Product?”, Shoply mostra invece il nome del prodotto, un breve punto forte del prodotto e domande generate automaticamente relative a quell’articolo. Non è necessario scrivere domande iniziali per ogni prodotto. Scopri come funzionano le domande sui prodotti alimentate dall’AI, oppure segui i passaggi per aggiungere un pulsante per le domande sul prodotto.

Vedi l’esempio per ciascun tipo di messaggio predefinito: