Come mettere un bottone «Chiedilo alla tua AI» sul tuo sito (una riga, gratis)

In breve: i tuoi lettori, quando hanno un dubbio su una tua pagina, con ogni probabilità ne copiano già un pezzo e lo incollano in ChatGPT. Questa guida spiega come mettergli un bottone che lo fa al posto loro — verso ChatGPT, Perplexity, Gemini, Grok o Claude. Una riga di codice, niente backend, niente cookie. Gratis.

La danza del copia-incolla

Fai caso a cosa succede davvero quando qualcuno legge una tua pagina e c’è qualcosa che non gli torna.

Seleziona il testo. Lo copia. Apre un’altra scheda. Va su ChatGPT. Incolla. Riscrive la domanda a mano. Cinque passaggi per una cosa che voleva solo chiedere.

Lo facciamo tutti, ogni giorno, senza nemmeno accorgercene. È diventato il modo normale di leggere: con un’AI aperta di fianco.

E allora la domanda è abbastanza ovvia: perché non mettergli un bottone?

Cos’è AI Ask Widget (e cosa non è)

AI Ask Widget è esattamente quel bottone. L’utente ci clicca, scrive la sua domanda, sceglie l’AI che preferisce e la trova già aperta con la domanda — e il link alla tua pagina — dentro. Fine.

La cosa importante è capire cosa non è.

Non è un chatbot. Nessun modello da addestrare, nessun prompt di sistema da scrivere, nessun «ciao sono l’assistente virtuale».
Non è un servizio. Non paghi token, non c’è un backend tuo che risponde, non c’è niente da tenere acceso.
Non è tuo il cervello. L’AI che risponde è quella che l’utente già usa e in cui è già loggato.

È un ponte, non un servizio. Collega la tua pagina all’AI del lettore, e poi si toglie di mezzo.

Installarlo: una riga prima di </body>

Questa è tutta l’installazione. Incolli questa riga poco prima del tag di chiusura </body> del tuo sito e hai finito.

<script src="https://www.matteobononi.it/tools/gpt-ask/js/ai-ask.min.js"
        data-brand="Chiedilo alla tua AI"
        data-ai="chatgpt,perplexity,gemini"
        defer></script>

Il defer fa in modo che non rallenti il caricamento della pagina. Sono circa 17KB, zero dipendenze esterne, nessuna libreria da tirarsi dietro. Su WordPress la riga va nel template o in un blocco HTML personalizzato nel footer; sugli altri CMS, ovunque tu possa mettere uno script prima di </body>.

Configurarlo con i data-attribute

Tutta la personalizzazione passa da attributi data-* sullo stesso tag. Niente file di config, niente pannello da imparare.

data-ai — quali AI mostrare, separate da virgola: chatgpt, perplexity, gemini, grok, claude.
data-brand — il testo del bottone (es. «Chiedilo alla tua AI»).
data-language — la lingua dell’interfaccia: it, en, es, fr, de.
data-questions — domande suggerite tue, in CSV o JSON.
data-context-prefix — istruzioni o «persona» da anteporre al prompt.
data-color — colore esadecimale, senza il cancelletto.
data-position — center, right o left.
data-analytics — true per far scattare gli eventi su GA4/GTM.

Una versione un po’ più vestita, per dare l’idea:

<script src="https://www.matteobononi.it/tools/gpt-ask/js/ai-ask.min.js"
        data-brand="Chiedilo alla tua AI"
        data-ai="chatgpt,claude,perplexity"
        data-language="it"
        data-position="right"
        data-color="ff5a1f"
        data-questions="Riassumimi questa pagina,Spiegamelo semplice"
        defer></script>

Il data-context-prefix è quello che mi diverte di più: puoi dire all’AI come comportarsi prima ancora che il lettore scriva. Roba tipo «rispondi come se spiegassi a chi è a digiuno di tecnica». Piccola cosa, cambia parecchio il risultato.

Quali AI puoi collegare

Cinque, al momento: ChatGPT, Perplexity, Gemini (il Google AI Mode), Grok e Claude. L’utente sceglie la sua al volo.

Su quattro di queste il widget apre direttamente l’AI con la domanda già compilata. Claude fa storia a sé — funziona, ma in un modo un po’ diverso, per una scelta che Anthropic ha fatto a fine 2025. Se sei curioso del perché, ne ho scritto in questo articolo.

Cosa NON fa (e perché è un bene)

Qui provo a essere onesto, perché in giro è pieno di widget «AI» che promettono la luna.

Non ti fa scalare Google. Non è uno strumento SEO. Quando un lettore manda la tua pagina a un’AI, quella visita non finisce negli indici di ricerca né addestra i modelli.
Non raccoglie dati. Nessun cookie, nessun tracciamento del visitatore. Gira al 100% nel browser, lato client.
Non garantisce che l’AI capisca la tua pagina. Le passa il link e la domanda; il resto lo fa il modello, con i suoi limiti.
Non sostituisce l’assistenza umana. È una scorciatoia per chi vuole ragionare sul tuo contenuto, non un customer care.

Detto tutto quello che non fa: quello che fa, lo fa bene. Toglie attrito a una cosa che le persone stanno già facendo. Non è poco.

Provalo

Il codice è su GitHub, licenza MIT: lo puoi leggere, forkare, self-hostare. La pagina del progetto, con la demo con cui ci giochi dal vivo, è qui.

Se lo metti da qualche parte, mi fa piacere saperlo.