Guida all'installazione e all'integrazione

Un'installazione tipica dello script si presenta in questo modo:

<script>
    (function(){
        var autochatConfig = {
            assistantId: "INSERT ASSISTANTID",
            accessToken: "INSERT ACCESSTOKEN",
            locale: "NL", // or EN/FR

            // To set up a link between the website and the car a consumer is looking at use one of these identification methods:
            currentCarVin: "PLACE CAR VIN NUMBER HERE",
            // - OR -
            licensePlate: "PLACE CAR LICENSE PLATE NUMBER HERE",
            // - OR -
            stockNumber: "PLACE CAR STOCK NUMBER HERE"
        };
        var s=document.createElement("script");s.src="https://static.chatclient.autochat.ai/release/autochat.js?ver=1",s.async=!0,s.defer=!0,s.addEventListener("load",function(){autochat.init(autochatConfig)}),document.body.appendChild(s);
    })()
</script>

Non utilizzare più di un metodo di identificazione del veicolo.

Puoi installare AutoChat in 2 modi:

• Installando il codice direttamente nel tuo sito web.

• Aggiungendo il nostro codice tramite Google Tag Manager.

Installazione tramite aggiunta di codice al codice sorgente del sito web

Per installare AutoChat nella sua forma più elementare, ovvero solo la chat bubble, nessun pulsante CTA e nessuna identificazione del veicolo, è necessario aggiungere 2 cose:

Posiziona questo HTML sotto l'apertura< corpo> etichetta:

e posiziona questo Javascript sopra la chiusura< /corpo> etichetta.

Non dimenticare di inserire assistantId e accessToken

Installazione tramite Google Tag Manager

Se utilizzi GTM sul tuo sito web, puoi anche installare AutoChat in questo modo.

Passaggio 1: accedi a Tag Manager e apri i tag

Passaggio 2: fare clic su Nuovo

Passaggio 3: fare clic sulla configurazione del tag

Passaggio 4: scegli HTML personalizzato

Passaggio 5: inserisci questo codice

<div id="autochat-root"></div>
<div id="autochat-chat-overlay"></div>
<script>
    (function(){
        var autochatConfig = {
            assistantId: "INSERT ASSISTANTID",
            accessToken: "INSERT ACCESSTOKEN",
            locale: "NL", // or EN/FR
        };
        var s=document.createElement("script");s.src="https://static.chatclient.autochat.ai/release/autochat.js?ver=1",s.async=!0,s.defer=!0,s.addEventListener("load",function(){autochat.init(autochatConfig)}),document.body.appendChild(s);
    })()
</script>

Non dimenticare di inserire assistantId e accessToken

Il risultato dovrebbe essere simile a questo:

Passaggio 6: scegliere l'attivazione

Passaggio 7: supponendo che tu voglia mostrare la bolla su tutte le pagine, seleziona tutte le pagine

Imposta un nome

Fai clic su Salva

Il risultato è simile a questo

Fase 8: pubblicare le modifiche sul sito web

La bolla della chat dovrebbe essere visibile sul sito web ora

Esistono diversi modi per interagire con l'assistente digitale di AutoChat sul sito web.

• Tramite la chat bubble

• Tramite una barra di ricerca

• Tramite un pulsante dedicato di invito all'azione

Tramite la chat bubble

Se installi la versione base del nostro script, la bolla verrà visualizzata automaticamente se è abilitata nella dashboard .

Stai utilizzando una SPA e vuoi mostrare la bolla della chat solo su alcune pagine? Puoi usare questo codice per mostrarla facoltativamente:

window.dispatchEvent(new Event('autochat_hide_chat_bubble'));
// To re-enable the bubble after disabling it, use the following command:
window.dispatchEvent(new Event('autochat_show_chat_bubble'));

Tramite una barra di ricerca

È possibile installare sul tuo sito web una barra di ricerca collegata ad AutoChat.

<textarea id="question"></textarea><button onclick="autochat.askQuestionToAi(document.getElementById('question').value);">Ask question</button>

Assicuratevi di limitare a 256 il numero di caratteri che inviate come domanda.

Per assicurarti di sfruttare appieno il potenziale del tuo assistente digitale, ti consigliamo di installare CTA specifiche e di connettere il tuo assistente digitale a queste.

Puoi utilizzare il tuo assistente digitale nei seguenti scenari:

• Per prenotare un appuntamento

• Per prenotare un appuntamento in showroom

• Per prenotare un appuntamento per un test drive

• Permutare un'auto

• Avere tutto il flusso di vendita sotto 1 CTA

• Per prenotare un appuntamento per il workshop

• Per creare una richiesta di contatto

Alcuni di questi flussi funzionano meglio quando sappiamo quale auto il consumatore sta visualizzando in quel momento (una cosiddetta pagina dei dettagli del veicolo). Per sfruttare al meglio le nostre funzionalità, assicurati di abilitare l'identificazione dell'auto.

Prenota un appuntamento

Se non sei sicuro se il consumatore desidera prenotare un appuntamento di vendita o post-vendita, puoi utilizzare questo approccio e lasciare che sia il consumatore a decidere da solo:

<button onclick="autochat.askQuestion('I want to book an appointment');">Book appointment</button>

Prenota un appuntamento in showroom

Per creare un pulsante che avvia il flusso dello showroom puoi utilizzare questo codice:

<button onclick="autochat.askQuestion('I want a showroom appointment');">Book showroom appointment</button>

Tuttavia, se si desidera dare al consumatore la possibilità di prenotare un appuntamento presso lo showroom per l'auto che sta guardando, è necessario utilizzare una versione leggermente diversa:

<button onclick="autochat.askQuestion('I want to see this car', { vdp: true });">Book a showroom appointment for this car</button>

È possibile saltare una o più domande aggiungendo informazioni aggiuntive nella frase di apertura, ad esempio:

<button onclick="autochat.askQuestion('I want to book a showroom appointment for BMW');">Book showroom appointment for BMW</button>

Nell'esempio sopra, l'assistente non chiederà il marchio perché sa già a quale marchio è interessato il consumatore.

Puoi anche includere una posizione specifica e saltare la domanda:

<button onclick="autochat.askQuestion('I want to book a showroom appointment at BMW Dealer 1');">Book showroom appointment at BMW Dealer 1</button>

È importante che il nome utilizzato qui sia esattamente lo stesso definito nella nostra dashboard.

Invece di utilizzare il nome della località nella frase di apertura, è anche possibile utilizzare un filtro:

<button onclick="autochat.askQuestion('I want to book a showroom appointment',{filterByLocationName:"Amsterdam"});">Showroom appointment</button>

Prenota un appuntamento per il test drive

Per avviare il flusso di prova, utilizzare questo codice:

<button onclick="autochat.askQuestion('I want to book a testdrive appointment');">Book a testdrive appointment</button>

Se vuoi prenotare un test drive per l'auto che stai visionando in questo momento usa:

<button onclick="autochat.askQuestion('I want to book a testdrive for this car', { vdp: true });">Book a testdrive for this car</button>

<button onclick="autochat.askQuestion('I want to book a testdrive appointment for a BMW 1 serie');">Book a testdrive appointment for a BMW 1 serie</button>

<button onclick="autochat.askQuestion('I want to trade in my current car');">Trade in my car</button>

È possibile utilizzare lo stesso codice indipendentemente dal fatto che ci sia o meno un contesto relativo all'auto, il che significa che se un consumatore si trova su una pagina con i dettagli di un veicolo, includeremo l'auto che sta visualizzando nel lead per la concessionaria.

Avere tutto il flusso di vendita sotto 1 CTA

Puoi anche creare un pulsante CTA e lasciare che il consumatore scelga cosa vuole fare:

<button onclick="autochat.askQuestion('I'm interested', { vdp: true });">I'm interested in this car</button>

Prenota un appuntamento per il workshop

La versione più semplice per creare un appuntamento per un workshop è:

<button onclick="autochat.askQuestion('I want to book a workshop appointment');">Book workshop appointment</button>

Oppure puoi saltare le domande:

<button onclick="autochat.askQuestion('I want to book a workshop appointment for my BMW');">Book workshop appointment for a BMW</button>

<button onclick="autochat.askQuestion('I want to book a workshop appointment for my BMW at BMW Dealer 1');">Book workshop appointment for a BMW at BMW Dealer 1</button>

<button onclick="autochat.askQuestion('I want to book a workshop appointment',{filterByLocationName:"Birmingham"});">Showroom appointment</button>

Crea una richiesta di contatto

Se vuoi che il consumatore lasci i suoi dati di contatto:

<button onclick="autochat.askQuestion('I want a contact request');">Contact me</button>

È molto importante arricchire l'esperienza del consumatore facendo sapere ad AutoChat quale auto sta guardando in quel momento.

In AutoChat dedichiamo molto tempo a creare integrazioni con i sistemi VMS (vehicle management system). Lo facciamo in modo da poter ricevere lo stock attuale di una concessionaria. Quando riceviamo lo stock, possiamo arricchire l'esperienza del consumatore nei seguenti modi:

• Siamo in grado di rispondere alle domande relative all'auto che il consumatore sta visionando (singola auto).

• Possiamo aiutare il consumatore a trovare l'auto che sta cercando (in tutto il parco auto).

• Possiamo far sapere al venditore esattamente a quale auto è interessato il consumatore.

• Possiamo mostrare al consumatore la disponibilità adeguata tra cui scegliere durante la creazione dell'appuntamento perché l'auto è collegata a una posizione specifica.

Nel caso in cui non otteniamo l'identificativo dell'auto dal sito Web o, per qualsiasi motivo, non abbiamo ricevuto l'auto nel nostro database, spesso ripieghiamo su quella che chiamiamo una versione di fall back di un certo flusso. Questa è una versione semplificata del flusso specifico e spesso si traduce in un'esperienza del consumatore non ottimale.

Ci sono diversi modi per informarci a quale auto è interessato il consumatore:

• Aggiungere l'identificatore nella configurazione di AutoChat

• Aggiungere un tag HTML sul sito web (consigliato)

• Aggiungere l'identificatore nel pulsante CTA

Aggiunta dell'identificatore tramite AutoChat Config

Puoi inviarci l'identificativo tramite la configurazione di AutoChat, nella quale ci invii anche le credenziali specifiche per l'assistente che viene installato sul sito web in questo modo:

<script>
    (function(){
        var autochatConfig = {
            assistantId: "INSERT ASSISTANTID",
            accessToken: "INSERT ACCESSTOKEN",
            locale: "NL", // or EN/FR

            // To set up a link between the website and the car a consumer is looking at use one of these identification methods:
            currentCarVin: "PLACE CAR VIN NUMBER HERE",
            // - OR -
            licensePlate: "PLACE CAR LICENSE PLATE NUMBER HERE",
            // - OR -
            stockNumber: "PLACE CAR STOCK NUMBER HERE"
        };
        var s=document.createElement("script");s.src="https://static.chatclient.autochat.ai/release/autochat.js?ver=1",s.async=!0,s.defer=!0,s.addEventListener("load",function(){autochat.init(autochatConfig)}),document.body.appendChild(s);
    })()
</script>

È importante notare che puoi usare solo un metodo di identificazione alla volta. Se troviamo più auto, invieremo sempre un risultato vuoto, il che significa che l'assistente non sa di quale auto si tratta.

stockNumer spesso rappresenta un numero interno proveniente dal Vehicle Management System.

Aggiungere l'identificatore tramite un tag HTML

In alternativa, puoi anche inviarci l'identificativo dell'auto aggiungendo questo tag HTML in qualsiasi punto della pagina dei dettagli del veicolo:

<div id="autochat-car-id" data-car-id="abc"></div>

Le informazioni nel tag non devono essere visibili sulla pagina.

Aggiungere l'identificatore nel pulsante CTA

In alcuni scenari, ad esempio quando si desidera installare un CTA per auto su una pagina di panoramica delle scorte, può essere utile implementare un identificatore auto per pulsante CTA. Questo è un esempio di un pulsante di prova che ha l'identificatore auto al suo interno:

<button onclick="autochat.askQuestion('I want a testdrive appointment for this car', { vdp: true, currentCarVin: 'ZFA3120000JB11486' });">I want to testdrive this car</button>

Se vuoi verificare se l'integrazione è stata creata correttamente tra il sito Web e AutoChat, puoi fare quanto segue. Apri una pagina dei dettagli del veicolo e avvia una chat cliccando su "fai una domanda" nella bolla della chat. Se vedi un'auto apparire sul lato destro dell'interfaccia della chat, sai che l'integrazione è stata configurata correttamente.