Vai al contenuto principale

Personalizza il raggio degli angoli del widget

Imposta da Aspetto quanto sono arrotondati suggerimenti, avatar, bolle di chat, pulsanti Aggiungi al carrello e campo di input.

Personalizza il raggio degli angoli del widget

Il raggio degli angoli stabilisce quanto sono arrotondati gli angoli del widget: da angoli squadrati a 0 px fino a un cerchio per l'avatar e a una forma a pillola per il pulsante Aggiungi al carrello e il campo di input. Olvio ti offre cinque slider separati, così puoi adattare ogni parte del widget al tuo tema. Sono disponibili con tutti i piani.

Gli stessi valori si applicano al widget nelle tue pagine prodotto, al pannello di chat e alle conversazioni di Olvio Advisor (piani Growth e Scale).

Trova gli slider del raggio degli angoli

  1. Nell'admin di Olvio, apri Aspetto.

  2. Nella scheda Pagina prodotto, il riquadro Suggerimenti contiene lo slider Raggio degli angoli.

  3. Nella scheda Pannello di chat, il riquadro Avatar contiene lo slider Raggio degli angoli e il riquadro Forma contiene gli slider Bolla di conversazione, Pulsante Aggiungi al carrello e Campo di input.

Scheda

Riquadro

Slider

Intervallo

Predefinito

Pagina prodotto

Suggerimenti

Raggio degli angoli

Da 0 a 24 px

12 px

Pannello di chat

Avatar

Raggio degli angoli

Da 0 a 16 px

16 px (cerchio)

Pannello di chat

Forma

Bolla di conversazione

Da 0 a 24 px

12 px

Pannello di chat

Forma

Pulsante Aggiungi al carrello

Da 0 a 32 px

32 px (pillola)

Pannello di chat

Forma

Campo di input

Da 0 a 32 px

32 px (pillola)

L'etichetta di ogni slider mostra il valore attuale, ad esempio Bolla di conversazione — 12 px. Lo slider dell'avatar aggiunge (cerchio) a 16 px, mentre gli slider Pulsante Aggiungi al carrello e Campo di input aggiungono (pillola) da 28 px in su.

Cosa cambia ogni slider sul tuo storefront

  • Raggio degli angoli di Suggerimenti: le domande suggerite nel widget Olvio sulla pagina prodotto.

  • Raggio degli angoli di Avatar: l'avatar mostrato accanto a ogni risposta dell'IA nel pannello di chat. A 16 px l'avatar è un cerchio.

  • Bolla di conversazione: i messaggi dell'acquirente, le risposte dell'IA e l'indicatore di digitazione. Arrotonda anche l'immagine del prodotto in cima al pannello di chat, le immagini delle schede prodotto nella chat e i badge di sconto ed esaurito su quelle schede. Qualunque sia il valore dello slider, l'angolo inferiore di ogni messaggio dal lato del mittente mantiene un raggio di 4 px.

  • Pulsante Aggiungi al carrello: il pulsante Aggiungi al carrello sopra il campo di input nel pannello di chat delle tue pagine prodotto e i pulsanti Aggiungi al carrello delle schede prodotto nella chat quando Attiva aggiungi al carrello nella chat è attivo. Consulta Mostra le schede prodotto e consenti l'aggiunta al carrello dalla chat.

  • Campo di input: il campo per le domande nella pagina prodotto e in fondo al pannello di chat, i menu delle varianti nelle schede prodotto (quando Attiva aggiungi al carrello nella chat è attivo) e i pulsanti di risposta mostrati sopra il campo di input nelle conversazioni di Olvio Advisor.

Il pulsante di invio e il pulsante di chiusura sono rotondi e non hanno uno slider.

Visualizza l'anteprima delle modifiche

L'Anteprima dal vivo si aggiorna mentre trascini uno slider. Aprendo la scheda Pagina prodotto vedi l'anteprima della pagina prodotto, con i suggerimenti e il campo di input. Aprendo la scheda Pannello di chat vedi l'anteprima del pannello di chat, con l'avatar, le bolle dei messaggi, il pulsante Aggiungi al carrello e il campo di input. Puoi anche passare dall'una all'altra con i pulsanti Pagina prodotto e Pannello di chat sopra l'anteprima.

L'anteprima non mostra le schede prodotto, i pulsanti di risposta dell'Advisor né il tuo CSS personalizzato, e il segnaposto della miniatura del prodotto in cima all'anteprima del pannello di chat non segue lo slider Bolla di conversazione (l'immagine del prodotto sul tuo storefront invece sì). L'avatar accanto alle risposte nell'anteprima segue lo slider Avatar, ma l'avatar più grande nel riquadro Avatar è sempre mostrato come un cerchio. Controlla il tuo storefront dopo aver salvato.

Salva e controlla il tuo storefront

  1. Quando sposti uno slider, compare una barra di salvataggio. Clicca su Salva, oppure su Scarta per tornare agli ultimi valori salvati.

  2. Attendi il messaggio Modifiche salvate. Se invece compare un messaggio di errore, ad esempio Too many requests, le modifiche non sono state salvate: la barra di salvataggio resta aperta, quindi attendi un momento e clicca di nuovo su Salva.

  3. Apri o ricarica una pagina prodotto del tuo storefront per vedere i nuovi angoli. L'avatar, la Bolla di conversazione e il Pulsante Aggiungi al carrello compaiono solo nel pannello di chat. Fai una domanda nel widget per aprirlo e controllarli.

Se non riesci a cliccare su Salva, cerca nella scheda Stile un campo colore che mostra Formato atteso: #rrggbb e correggilo prima.

Non c'è un pulsante di ripristino. Per tornare ai valori predefiniti, porta ogni slider al valore predefinito indicato nella tabella qui sopra e salva.

Se il tuo storefront mostra ancora le vecchie forme, consulta Le mie modifiche di Aspetto non compaiono sul negozio online.

Cosa non coprono gli slider

  • Impostazioni del blocco nell'editor del tema: il blocco Olvio — Product page nell'editor del tema di Shopify può sovrascrivere solo i colori e la dimensione del font. Il raggio degli angoli viene sempre da Aspetto.

  • Altre forme: per modificare una forma che non ha uno slider, come il pulsante di invio, usa il CSS personalizzato. Consulta Aggiungi CSS personalizzato al widget.

Hai ricevuto la risposta alla tua domanda?