Skip to main content
IperChat
EN
Accedi

Integrazioni

Plugin WordPress in 5 passi

Installa IperChat su WordPress senza toccare codice: cerca il plugin, attivalo, incolla il Tenant ID, ricarica.

Per WordPress c’è un plugin ufficiale (versione 1.1.0, compatibile con WordPress 5.8+ e testato fino a 6.9; richiede PHP 7.4+). Fa due cose:

  1. Carica lo script del widget nel wp_footer() di ogni pagina.
  2. Espone uno shortcode [iperchat] per l’embed inline.

Niente di magico: il plugin è in pratica lo snippet HTML standard, gestito dall’admin invece che dal <body> del tema.

Prima di iniziare

1. Cerca e installa il plugin

Accedi al tuo WordPress (tuosito.it/wp-admin).

  1. Menu laterale → PluginAggiungi nuovo plugin.
  2. Nella ricerca in alto a destra digita “IperChat”.
  3. Il plugin appare tra i primi risultati. Autore: francescoipercontent. Icona arancione con il fumetto.

Ricerca del plugin IperChat nella pagina Plugin → Aggiungi nuovo

  1. Clicca Installa ora. Quando il bottone diventa Attiva, cliccalo.

Pulsante "Attiva" del plugin IperChat dopo l'installazione

2. Ottieni il tuo Tenant ID

Il Tenant ID è l’identificativo unico del tuo spazio IperChat. Collega il widget sul sito alla configurazione del tuo agente (colori, comportamento, knowledge base).

Hai due strade.

A — Hai già un account IperChat

  1. Vai su admin.iperchat.ai.
  2. Apri “Il mio Tenant” (gruppo Gestione nel menu laterale).
  3. Il Tenant ID è la stringa in carattere monospace sotto il titolo della pagina: copialo da lì. In alternativa, apri “Documentazione” (gruppo Agents): lo snippet mostrato ha il Tenant ID già dentro data-tenant-id.

Pannello operativo → Il mio Tenant, con il Tenant ID in evidenza

B — Non hai ancora un account

  1. Nel WordPress vai su Impostazioni → IperChat.
  2. Clicca “Collega il tuo sito”.
  3. Si apre la demo IperChat con l’URL del tuo sito già compilato.
  4. Completa l’analisi gratuita, registra l’account, scegli un piano.
  5. La schermata finale dell’onboarding mostra lo snippet pronto con il Tenant ID già dentro l’attributo data-tenant-id. Copialo da lì.

Schermata finale dell'onboarding con lo snippet del widget e il Tenant ID dentro data-tenant-id

3. Incolla il Tenant ID e salva

Torna nel WordPress.

  1. Impostazioni → IperChat.
  2. Nel campo Tenant ID incolla il valore e clicca Attiva nella sezione “Ho già un account”.
  3. Dopo l’attivazione il plugin mostra il pannello Impostazioni widget. Puoi personalizzare:
    • PosizioneIn basso a destra (default), In basso a sinistra, o In linea (incorporato nella pagina).
    • LinguaAutomatica (lingua del browser) o forzata a Italiano / Inglese / Spagnolo.
    • Sito di origine (opzionale) — per applicare configurazioni per-pagina dal pannello operativo.
  4. In Impostazioni avanzate trovi l’ID del contenitore (usato in modalità Inline) e il toggle Auto-initialize.
  5. Clicca Salva modifiche.

Pagina Impostazioni → IperChat del plugin WordPress con il campo Tenant ID compilato

Il plugin esegue una verifica del dominio (vedi passo 5).

4. Verifica il widget sul sito

  1. Apri la home del tuo sito in una nuova scheda.
  2. Ricarica (Ctrl+R / Cmd+R).
  3. Dopo qualche secondo dovrebbe apparire il pulsante della chat nell’angolo scelto.
  4. Cliccalo, fai una domanda, verifica la risposta.

5. Autorizza il dominio (se necessario)

Se vedi un avviso tipo “dominio non autorizzato” in console o l’agente non risponde, è perché il tuo dominio WordPress non è ancora nella lista autorizzata sul tenant. Nota: il plugin esegue una verifica al salvataggio, quindi può mostrarti l’avviso direttamente nelle impostazioni.

Per autorizzarlo:

  1. admin.iperchat.ai“Il mio Tenant” (gruppo Gestione).
  2. Nella sezione Impostazioni aggiungi il dominio esatto (es. www.miosito.it) al campo Domini consentiti (lista separata da virgola).
  3. Salva, ricarica il sito WordPress: il widget compare.

Pannello operativo IperChat: campo Domini consentiti con il dominio WordPress aggiunto

Shortcode [iperchat] per embed inline

Se imposti Posizione = In linea (incorporato nella pagina) nelle impostazioni del plugin, il widget non appare più come pulsante flottante. Lo inserisci dove vuoi via shortcode:

ShortcodeEffetto
[iperchat]Embed standard all’altezza di default
[iperchat height="500px"]Altezza personalizzata
[iperchat id="la-mia-chat"]ID contenitore HTML personalizzato (utile per CSS custom)

Lo shortcode funziona in pagine, articoli e nei principali page builder (Elementor, WPBakery, Divi, Gutenberg con il blocco “Shortcode”).

Risoluzione problemi

Il widget non appare

Cinque controlli in ordine:

  1. Tenant ID incollato senza spazi iniziali/finali e salvato.
  2. Dominio autorizzato nel pannello operativo (vedi passo 5 — Il mio Tenant → Domini consentiti).
  3. Plugin di caching o CDN — svuota dopo aver salvato.
  4. Plugin di defer JS o minificazione — escludi iperchat.iife.js.
  5. Tema custom — verifica che ci sia wp_footer() nel footer.php.

”Lo shortcode mostra solo il testo”

  • La pagina è renderizzata come HTML puro? Alcuni page builder ignorano gli shortcode.
  • Posizione impostata su In linea (incorporato nella pagina)?
  • In Gutenberg usa il blocco Shortcode.
  • In Elementor / Divi / WPBakery usa l’elemento Shortcode dedicato.

”Conflitto con un altro plugin di chat”

Se hai già Tidio, Crisp, Intercom attivi, i widget si sovrappongono. Soluzioni:

  • Cambia posizione di IperChat (es. bottom-left).
  • Disattiva l’altro plugin durante i test.

”Non vedo le modifiche dopo aver salvato”

  • Svuota la cache del sito (plugin caching + CDN).
  • Ctrl+Shift+R / Cmd+Shift+R per forzare il refresh del browser.
  • Importante: la configurazione del widget (colori, saluti, comportamento) non si imposta dal plugin, ma dal pannello operativo. Il plugin trasporta solo Tenant ID, posizione e lingua.

Filtri per sviluppatori

Se devi puntare il plugin a un ambiente di staging, ci sono tre filtri WordPress in functions.php:

add_filter('iperchat_widget_url', function() {
  return 'https://widget-staging.iperchat.ai/iperchat.iife.js';
});

add_filter('iperchat_demo_url', function() {
  return 'https://demo-staging.iperchat.ai';
});

add_filter('iperchat_api_url', function() {
  return 'https://api-staging.iperchat.ai';
});

Prossimi passi