Vai al contenuto principale

Aggiungi il widget Olvio alle tue pagine prodotto

Aggiungi il blocco Olvio a un modello di prodotto nell'editor del tema di Shopify per mostrare il widget sulle tue pagine prodotto.

Aggiungi il widget Olvio alle tue pagine prodotto

Il widget Olvio è un blocco che aggiungi al modello di prodotto nell'editor del tema di Shopify. Nelle tue pagine prodotto mostra il tuo Nome dell'esperto, la tua Domanda d'aggancio, le domande suggerite e un campo per le domande, e il pannello di chat si apre quando un cliente invia una domanda. Non devi modificare il codice del tema.

Prima di iniziare

  • Il tuo tema deve essere un tema Online Store 2.0. Se Olvio rileva un tema Online Store 1.0 meno recente, la Dashboard mostra il banner Il tuo tema non è compatibile con il widget Olvio. Consulta Online Store 1.0 non supportato — cosa fare.

  • Il widget appare sul tuo storefront solo finché hai un abbonamento a un piano, anche durante la prova gratuita.

  • Collega la tua chiave API Anthropic. Senza chiave, il blocco mostra comunque il suo Nome dell'esperto, la sua Domanda d'aggancio e il campo per le domande, ma nessuna domanda suggerita, e l'invio di un messaggio mostra un messaggio di errore (in italiano: Siamo spiacenti, si è verificato un errore. Riprova.). Consulta Connetti la tua chiave API Anthropic (Claude).

Aggiungi il blocco dalla guida di configurazione

  1. Apri Olvio dal pannello di controllo Shopify. Nella Dashboard, trova la scheda Prepara Olvio per il tuo primo cliente.

  2. Nel passaggio Aggiungi il blocco Olvio alla tua pagina prodotto, clicca su Apri l'editor del tema. L'editor del tema di Shopify si apre in una nuova scheda del browser su un modello di prodotto, con il blocco Olvio aggiunto in una nuova sezione App da visualizzare in anteprima.

  3. Trascina la sezione nel punto della pagina in cui vuoi che appaia il widget.

  4. Clicca su Salva per aggiungerlo al tuo tema. Il blocco appare sul tuo storefront solo se quel tema è il tuo tema pubblicato.

La scheda scompare quando tutti i passaggi sono completati. Se hai cliccato su Nascondi nella scheda, non ricompare, quindi aggiungi il blocco manualmente come descritto di seguito. Consulta La tua guida di configurazione: prepara Olvio per il tuo primo cliente.

Aggiungi il blocco manualmente

  1. Dal pannello di controllo Shopify, vai a Negozio online.

  2. Trova il tuo tema pubblicato, poi clicca su Modifica tema. Se aggiungi il blocco a un altro tema, appare sul tuo storefront solo quando quel tema viene pubblicato.

  3. Apri il menu delle pagine in alto nell'editor (mostra Home page) e seleziona il modello di prodotto che vuoi modificare.

  4. Nella barra laterale, clicca su Aggiungi sezione, oppure su Aggiungi blocco all'interno della sezione in cui vuoi il widget.

  5. Dal menu a discesa, nella sezione App, seleziona Olvio — Product page.

  6. Se necessario, trascina il blocco nella posizione desiderata, poi clicca su Salva.

Il blocco Olvio è disponibile solo nei modelli di prodotto. Le modifiche a un modello si applicano a tutti i prodotti che lo usano, quindi se alcuni dei tuoi prodotti usano un altro modello di prodotto (scelto nell'impostazione Modello di tema del prodotto), aggiungi il blocco anche a quel modello.

Se il blocco non è nell'elenco, consulta Non trovo il blocco Olvio nell'editor del tema.

Sostituisci i colori o la dimensione del font per un modello (opzionale)

Per impostazione predefinita, il widget usa i colori e la dimensione del font impostati nella pagina Aspetto di Olvio. Per modificarli solo per un modello, seleziona il blocco Olvio nell'editor del tema e usa le sue impostazioni:

  • Use custom colors for this block: quando la casella è selezionata, il widget usa i colori Accent, Accent foreground, Background, Surface, Border, Text e Muted text impostati nel blocco.

  • Use custom font size for this block: quando la casella è selezionata, il widget usa la Base font size del blocco, da 12 a 20 px (14 px per impostazione predefinita).

Queste personalizzazioni si applicano a tutti i prodotti che usano il modello, e anche al pannello di chat che si apre dal widget. Il font, il raggio degli angoli, l'avatar e il CSS personalizzato provengono sempre dalla pagina Aspetto. Consulta Personalizza i colori del widget.

Verifica che il widget sia attivo

Apri una pagina prodotto sul tuo storefront: il widget appare dove hai posizionato il blocco. La prima volta che il widget si carica su un prodotto attivo che Olvio ha già importato, la guida di configurazione segna questo passaggio come completato (se ci sono ancora altri passaggi da completare, il suo pulsante diventa Vedi conversazioni). Questo passaggio può essere spuntato anche mentre visualizzi l'anteprima del blocco nell'editor del tema, quindi controlla una pagina prodotto sul tuo storefront live per confermare che il blocco sia salvato: un'anteprima da sola non lo pubblica. Per provare una conversazione completa, consulta Testa Olvio sul tuo negozio online.

Se hai selezionato Nascondi il widget nelle lingue che Olvio non copre nella sezione Lingue della scheda Avanzato di Aspetto, il widget non appare quando un cliente naviga nel tuo negozio in una lingua che il widget non copre. Quando la casella è deselezionata, il widget viene comunque mostrato su quelle pagine: le sue domande suggerite sono nella tua lingua principale e la chat inizia in quella lingua. Su una pagina in una lingua che Olvio non supporta, le domande suggerite sono invece in inglese, e la chat inizia in inglese, se il tuo widget offre l'inglese. Sotto la casella, Olvio elenca le lingue pubblicate dal tuo negozio che il widget non copre. Se il widget copre tutte le lingue pubblicate dal tuo negozio, la casella appare in grigio. L'editor del tema mostra sempre il blocco, qualunque sia la lingua dell'anteprima. Consulta Multilingua: scegli quali lingue copre il tuo widget.

Se il widget continua a non apparire, consulta Il widget non appare sul mio storefront.

Usa Olvio Advisor (Growth e Scale)

Il blocco della pagina prodotto è separato da Olvio Advisor. Se il tuo negozio ha il piano Growth o Scale e usi i link Advisor, attiva anche l'incorporazione app Olvio Advisor nel tuo tema pubblicato: nell'editor del tema, clicca sull'icona Incorporazioni app, attiva Olvio Advisor, poi clicca su Salva. I link Advisor richiedono questa incorporazione: una volta attivata, un link apre Advisor su qualsiasi pagina del tuo negozio, tranne nelle lingue nascoste da Nascondi il widget nelle lingue che Olvio non copre. Consulta Attiva Olvio Advisor e aggiungi i link Advisor al tuo negozio.

Hai ricevuto la risposta alla tua domanda?