Documentazione

Shopify

Installa il widget Agentkit in un tema Shopify con il codice generato completo.

Aggiungi il widget Agentkit al tuo negozio Shopify inserendo il codice di incorporamento generato completo in theme.liquid.

In Agentkit apri Canali → Incorporamento nel sito web → Widget di chat, abilita il canale e copia il codice completo. Contiene due tag script: un bootstrap inline e un caricatore asincrono. Mantieni entrambi. Shopify consiglia di duplicare il tema prima di modificarne il codice.

Metodo 1: modificare theme.liquid

Aggiungi il widget a tutto il sito modificando il tuo tema pubblicato:

  1. Nell'admin di Shopify, vai su Online Store → Themes.
  2. Sulla riga del tuo tema live, clicca sul menu ... (Actions) → Edit code.
  3. Nella cartella Layout a sinistra, apri theme.liquid.
  4. Scorri fino in fondo e incolla il tuo codice di embed appena prima del tag di chiusura </body>.
  5. Clicca su Save.

Incolla il codice copiato senza modificarlo. Dopo il salvataggio, verifica che entrambi i tag <script> siano presenti nel sorgente dello storefront visualizzato.

Il widget appare su ogni pagina dello storefront — prodotto, collezione, carrello, home.

Metodo 2: duplicare prima, poi modificare (consigliato)

Se vuoi un rollback sicuro:

  1. Online Store → Themes.
  2. Sul tuo tema live, clicca sul menu ... (a tre puntini) → Duplicate. Una copia appare in fondo all'elenco dei temi.
  3. Modifica il theme.liquid del duplicato come sopra.
  4. Clicca sul menu ... del duplicato → Preview per testarlo.
  5. Quando sei soddisfatto, clicca sul menu ... → Publish per renderlo live.

Installazione su una sola pagina

Per mostrare il widget solo su una pagina, chiedi a uno sviluppatore di temi di limitare entrambi i tag generati a un modello di pagina. Verifica che compaiano lì e non nelle altre pagine. L’editor di testo delle pagine Shopify non è un metodo di installazione verificato per questo widget.

Requisiti

  • Serve accesso al codice del tema. Un tema a pagamento in prova non può essere modificato prima dell’acquisto. Il tuo ruolo deve avere i permessi Themes ed Edit code. Consulta la guida Shopify al codice dei temi.
  • Mantieni abilitato il canale Widget di chat di Agentkit durante la prova del negozio pubblico.
  • Se usi restrizioni di dominio, consenti l’origine esatta dell’anteprima del tema e quella del negozio pubblico. Rimuovi l’origine temporanea dell’anteprima dopo la prova.

Dopo la pubblicazione

Se il widget non appare nel negozio pubblico:

  1. Forza l'aggiornamento della pagina (⌘+Shift+R su Mac, Ctrl+F5 su Windows).
  2. Apri il sito in una finestra in incognito.
  3. Controlla la console del browser per eventuali errori.

Risoluzione dei problemi

Il widget non compare.

  • Conferma di aver modificato il tema live (o pubblicato il duplicato).
  • Verifica che entrambi i tag script generati siano prima di </body> nel sorgente dello storefront.
  • Verifica che le restrizioni di dominio di Agentkit consentano il dominio del negozio.

Il widget si sovrappone alla chat di Shopify o al cassetto del carrello.

  • Regola la posizione del widget nelle impostazioni Design del tuo agente.

Il widget appare nell'editor ma non nel negozio live.

  • Assicurati di aver cliccato Save dopo aver incollato il codice — l'editor di codice non salva automaticamente.

Test

  1. Apri il tuo storefront in una finestra in incognito.
  2. Cerca la chat bubble nell'angolo.
  3. Clicca per aprirla e invia un messaggio di prova.
  4. Verifica che entrambi i tag script generati siano presenti nel sorgente della pagina.

Collega un Negozio per Ricerca Prodotti e Verifica Ordini

Incorporare il widget e collegare il tuo negozio sono due cose separate. Il codice di embed sopra inserisce il widget della chat sul tuo storefront. Una connessione Shopify separata — effettuata dalla scheda Azioni > Integrazioni del tuo agente — permette inoltre all'agente di cercare nel tuo catalogo live e verificare lo stato di un ordine all'interno della conversazione.

Puoi fare ciascuna delle due cose da sola. Usa solo l'embed se l'agente deve rispondere esclusivamente in base ai contenuti di addestramento, e aggiungi la connessione al negozio quando vuoi dati live su prodotti e ordini.

Collegare il negozio fornisce solo le credenziali, ma non attiva nulla di per sé: successivamente, aggiungi le azioni Cerca prodotti e Verifica stato ordine nella scheda Azioni del tuo agente e attiva ciascuna che vuoi che l'agente utilizzi.

Configura le azioni Shopify →

Prossimi passi