Come installare l'agente su Shopify
Dove inserire il codice nel tema Shopify, come l'agente legge il catalogo del negozio, cosa fare con il carrello e il pagamento e come verificare l'installazione.
Shopify ha già un catalogo in formato leggibile da macchina, per questo l'agente raccoglie i prodotti con una precisione superiore a qualsiasi altro sistema: prezzi, varianti, disponibilità e foto provengono direttamente dal negozio.
Passaggio 1. Inserisci il codice nel tema#
- Nell'amministrazione di Shopify, apri Online Store → Themes.
- Sul tema attivo, clicca … → Edit code.
- Nell'elenco dei file, cerca
layout/theme.liquid. - Inserisci la riga di codice dall'area personale subito prima del tag di chiusura
</body>. - Salva.
Alternativa senza modificare il tema: Online Store → Preferences → Custom code o qualsiasi app per l'inserimento di script. Il risultato è lo stesso.
<!-- Commerce Agents -->
<script src="https://comag.vibevox.pro/widget.js" data-slug="il-tuo-slug" async></script>
</body>
</html>Prendi la riga esatta nell'area personale tramite il pulsante «Copia codice»: contiene già l'indirizzo del tuo negozio.
Passaggio 2. Raccogli il catalogo#
Nelle impostazioni, indica l'indirizzo del negozio e avvia l'analisi. Il crawler di Shopify legge i dati strutturati dei prodotti: nome, prezzo, valuta, disponibilità, descrizione e foto. Le varianti (taglie, colori) vengono inserite nella scheda come caratteristiche.
Un'analisi ripetuta aggiorna prezzi e disponibilità. Avviala dopo importanti modifiche all'assortimento: l'agente non si connette direttamente al tuo database, ma lavora con il catalogo raccolto.
Passaggio 3. Lascia il pagamento al negozio#
Su Shopify non è necessario abilitare il pagamento in chat. Lo schema corretto è:
- Nelle impostazioni del negozio, indica il link al carrello — di solito
https://iltuo-dominio/cart. - L'agente seleziona il prodotto, mostra la scheda e, tramite un pulsante, porta il cliente al carrello di Shopify.
- Il checkout e il pagamento seguono il percorso abituale, con tutte le tue regole di spedizione e tasse.
Per vedere quali conversazioni si concludono con un acquisto, inserisci il frammento del pixel di acquisto nella pagina di ringraziamento. Su Shopify, questo si trova in Settings → Checkout → Order status page → Additional scripts. Il frammento con la sostituzione del numero d'ordine e dell'importo si trova nell'area personale, nella sezione «Widget e link».
Il prodotto finisce nel carrello senza interrompere la conversazione#
Qui Shopify si rivela migliore delle altre piattaforme. L'agente mostra le schede prodotto con foto, prezzo e un pulsante, ma il pulsante non si limita a portare a una pagina: aggiunge il prodotto al carrello del negozio.
Funziona così: nel link del prodotto Shopify è presente un identificatore di variante, l'agente lo trasmette al tuo carrello tramite l'interfaccia standard /cart/add.js. La pagina non si ricarica, il dialogo non si interrompe, il cliente vede una breve conferma e continua a scegliere. Il prodotto è già nel carrello di Shopify, con tutte le tue regole di sconti, tasse e spedizione.
Se non c'è una variante nel link, l'agente apre la scheda prodotto e il cliente la aggiunge da sé. Nulla si rompe, è solo un clic in più.
Quando il cliente è pronto, il pulsante «Procedi al checkout» porta a /cart, dove tutto è già stato raccolto. Poi, il normale checkout di Shopify.
E a proposito del contesto: l'agente legge i dati strutturati della pagina in cui è aperta la chat. Il cliente guarda un prodotto specifico e chiede «è disponibile nella taglia L?» — l'agente capisce di cosa si tratta senza dover chiedere chiarimenti.
- Apri il negozio in incognito, attendi il pulsante della chat.
- Chiedi del prodotto per nome — dovrebbe apparire una scheda con il prezzo.
- Clicca «Procedi al checkout» — dovrebbe aprirsi il carrello di Shopify.
- Effettua un ordine di prova e assicurati che l'acquisto sia stato registrato in «Richieste».
Chat in linea con la vetrina#
Il tema di Shopify imposta l'atmosfera dell'intero negozio, e la chat non dovrebbe stonare. Nelle impostazioni del widget ci sono tre opzioni: chiara, scura e «come il visitatore», che segue le impostazioni del dispositivo del cliente.
Per i negozi con tema scuro, imposta la modalità scura in modo fisso; per quelli chiari, la modalità chiara. Il colore d'accento dei pulsanti rimane il tuo in entrambi i casi.
Passaggio 4. Verifica#
Problemi frequenti#
Widget scomparso dopo il cambio tema. Il codice risiede nel file del tema. Il cambio o l'aggiornamento del tema cancella la modifica: inserisci nuovamente il codice o usa Custom code, che non dipende dal tema.
Catalogo non raccolto completamente. Il crawler preleva i prodotti dalle pagine pubbliche. I prodotti nascosti dal catalogo e le bozze non vengono inclusi, ed è corretto.
Prezzi del catalogo obsoleti. Avvia nuovamente l'analisi del sito, aggiornerà prezzi e disponibilità per le schede esistenti.
Il widget è in conflitto con l'app di chat. Lascia una sola chat: due finestre nello stesso angolo si ostacolano a vicenda e confondono il cliente.
Domande frequenti#
È necessaria un'app da Shopify App Store#
No. L'agente si collega con una singola riga di codice, non è richiesta l'installazione di un'app.
L'agente è in grado di mostrare le varianti del prodotto#
Sì, le varianti vengono inserite nella scheda come caratteristiche: taglia, colore, volume. Il cliente sceglie la variante specifica nel carrello di Shopify.
Come gestire più valute#
L'agente mostra i prezzi nella valuta del catalogo, che determina durante la scansione. La funzionalità multivaluta di Shopify opera successivamente, lato carrello e pagamento.
L'agente sarà a conoscenza delle scorte#
La disponibilità viene rilevata al momento dell'analisi. Per i prodotti che si esauriscono spesso, avvia l'analisi più frequentemente o aggiungi una clausola che indichi che la disponibilità viene verificata al momento del checkout.
Il widget influisce sulla velocità del negozio#
Lo script si carica in modo asincrono e non blocca il rendering. Questo non influisce praticamente sulle metriche Core Web Vitals.