Esistono tre modi per aggiungere un pulsante WhatsApp a WordPress: incollare uno script nel footer del sito, installare un plugin dedicato oppure aggiungere un semplice link a una pagina o al menu. Questa guida illustra ogni metodo, mostra dove inserire il codice nei temi classici e a blocchi e spiega cosa controllare per evitare che il pulsante rallenti la pagina o copra elementi importanti.
Per prima cosa ti serve il link a cui punterà il pulsante. Se non ne hai ancora uno, ecco come creare un link WhatsApp in un paio di minuti.
Quale metodo scegliere?
- Pulsante flottante tramite script: appare in ogni pagina, rimane leggero e non richiede plugin aggiuntivi.
- Plugin dedicato: puoi configurare tutto dalla bacheca senza scrivere codice, ma avrai un altro plugin da mantenere.
- Semplice link o pulsante: non aggiunge peso, ma compare solo dove lo inserisci.
Metodo 1: il widget WaLinks, una riga di script
Il widget WhatsApp di WaLinks è un pulsante verde flottante nell’angolo inferiore della pagina. Quando lo tocchi, apre la chat nell’app WhatsApp sul telefono o in WhatsApp Web sul computer. È incluso nel piano Starter. Ecco come configurarlo:
- Crea il tuo link su WaLinks con il numero e, se vuoi, un messaggio precompilato.
- Nella bacheca, apri il widget relativo a quel link e scegli un colore, il lato destro o sinistro e un eventuale saluto, che appare in un fumetto dopo 3 secondi.
- Copia il codice di installazione. È una sola riga, simile a questa:
<script src="https://wha.mx/w/your-business.js" data-position="left" data-greeting="Hi! Need a hand?" async></script>
Gli attributi data- compaiono solo quando modifichi l’aspetto predefinito. Numero e messaggio si trovano nel link stesso, quindi puoi cambiarli dalla bacheca senza toccare WordPress. Colore, lato e saluto fanno invece parte del codice: se li modifichi, copia di nuovo la riga e sostituisci quella precedente.
Lo script va inserito subito prima del tag di chiusura </body>, in ogni pagina. WordPress offre tre punti in cui collocarlo.
Opzione A: un blocco HTML personalizzato nel footer
Se incolli lo script in un blocco HTML personalizzato all’interno di un articolo, il pulsante apparirà soltanto in quell’articolo. Per mostrarlo in tutto il sito, inseriscilo in un elemento condiviso:
- Tema a blocchi (Twenty Twenty-Four, Twenty Twenty-Five e simili): apri l’editor del sito dalla sezione Aspetto, entra nella parte del template Footer, aggiungi un blocco HTML personalizzato, incolla la riga e salva.
- Tema classico: dalla sezione Aspetto, apri i widget, scegli un’area del footer e aggiungi un blocco HTML personalizzato. Funziona soltanto se il tema dispone di un’area widget nel footer.
Se lo script scompare al momento del salvataggio, il tuo account non dispone della capacità unfiltered_html. In un sito normale è disponibile per amministratori ed editor; in una rete multisito, soltanto per i super amministratori.
Opzione B: functions.php e l’hook wp_footer
Se hai dimestichezza con il codice, aggiungi quanto segue al file functions.php di un tema child. Se lo inserisci nel tema principale, il prossimo aggiornamento lo cancellerà:
add_action( 'wp_footer', function () {
echo '<script src="https://wha.mx/w/your-business.js" async></script>';
} );
L’hook wp_footer stampa il codice subito prima della chiusura del tag body, sia nei temi classici sia in quelli a blocchi. Puoi modificare il file dall’editor dei file del tema, raggiungibile dalla sezione Aspetto nei temi classici o dalla sezione Strumenti nei temi a blocchi. Un solo errore di sintassi può rendere il sito irraggiungibile, quindi tieni a portata di mano l’accesso FTP o il file manager del provider.
Opzione C: un plugin per il codice di header e footer
È la soluzione più semplice se preferisci non modificare file. Il più diffuso è «WPCode», attivo su oltre 3 milioni di siti. Incolla la riga nel campo Footer e salva. Poiché non dipende dal tema, il codice rimane anche quando lo cambi.
Metodo 2: un plugin WhatsApp dedicato
Cerca «WhatsApp» nella schermata per aggiungere nuovi plugin e troverai decine di estensioni per pulsanti e chat. Funzionano tutte nello stesso modo: installi il plugin, inserisci il numero in formato internazionale, scegli testo e posizione e compare il pulsante. Alcune permettono anche di impostare gli orari di apertura o più addetti.
Prima dell’installazione, controlla nella scheda del plugin la data dell’ultimo aggiornamento, la compatibilità con la tua versione di WordPress e il numero di installazioni attive. Se ti serve soltanto il pulsante, una riga di script svolge lo stesso lavoro con meno componenti da gestire.
Metodo 3: un semplice pulsante o link nel menu
Non tutto deve essere flottante. A volte basta un pulsante nella pagina Contatti o una voce «WhatsApp» nel menu, usando un link wa.me o uno breve:
https://wa.me/15551234567 (United States)
https://wa.me/5215512345678 (Mexico)
https://wha.mx/your-business (short link)
- In una pagina: aggiungi un blocco Pulsanti, scrivi «Scrivici su WhatsApp», fai clic sull’icona del link e incolla l’URL.
- Nel menu di un tema classico: dalla sezione Aspetto, apri i menu e scegli i link personalizzati. Incolla l’URL, aggiungi l’etichetta e inseriscilo nel menu.
- Nel menu di un tema a blocchi: nell’editor del sito, seleziona il blocco Navigazione nell’header e aggiungi un link personalizzato.
Non sai quale tipo di link usare? Ecco un confronto diretto tra wa.me e un link breve. La differenza pratica è che un link breve può essere modificato e tracciato senza intervenire sul sito.
Velocità, accessibilità e posizione su mobile
Mantienilo veloce
- Caricalo in modo asincrono: conserva l’attributo
async, così lo script non bloccherà mai il rendering. Il codice del widget lo include già. - Un solo pulsante: non eseguire lo script insieme a un plugin WhatsApp. Significherebbe due download per la stessa funzione e due pulsanti in competizione per lo stesso angolo.
Rendilo utilizzabile da tutti
Un pulsante composto soltanto da un’icona ha bisogno di un testo per gli screen reader. Il widget WaLinks include un attributo aria-label; se crei un pulsante usando un’immagine, aggiungi un testo alternativo come «Scrivici su WhatsApp». Se cambi colore, assicurati inoltre che risalti sullo sfondo.
Evita che copra altri elementi su mobile
Sugli schermi piccoli, il widget si riduce a 54 pixel e resta a 16 pixel dal bordo. Anche così, l’angolo inferiore è affollato: banner dei cookie, pulsanti per tornare in cima e la barra fissa «Aggiungi al carrello» usata da molti temi WooCommerce. Se si sovrappone, spostalo a sinistra con data-position="left" oppure sollevalo con una riga di CSS personalizzato, disponibile nella sezione CSS aggiuntivo del personalizzatore o nel pannello degli stili dell’editor del sito:
#walinks-widget-your-business { bottom: 90px !important; }
Sostituisci your-business con il nome del tuo link e controlla il risultato su un telefono reale.
Come tracciare i clic sul pulsante
Il widget punta al tuo link breve, quindi ogni tocco passa da lì. Nelle statistiche dei link WhatsApp puoi vedere clic, dispositivi, Paesi e orari di punta. Usa un link per il sito e uno distinto per Instagram o per il codice QR: saprai esattamente quante conversazioni avvia il sito.
Se vuoi raccogliere alcuni dati del cliente prima che ti scriva, scopri quando usare un modulo di contatto o un pulsante WhatsApp.
Errori comuni
- Il pulsante non appare dopo averlo aggiunto: quasi sempre dipende dalla cache. Svuota quella del plugin per le prestazioni, quella del provider e quella della CDN, quindi prova in una finestra privata.
- Compare solo quando muovi il mouse: alcuni plugin per le prestazioni rimandano tutto il codice JavaScript finché il visitatore non interagisce. In WP Rocket l’impostazione si chiama «Delay JavaScript execution»; aggiungi
wha.mx/w/ai file esclusi. Gli altri plugin di ottimizzazione offrono opzioni simili. - Numero con formato errato: in un link
wa.meil numero deve includere il prefisso internazionale, senza+, spazi, trattini o zero iniziale. - Script incollato in un solo articolo: un blocco HTML dentro un articolo si applica soltanto lì. Per tutto il sito, usa il footer,
wp_footero un plugin per header e footer.
Domande frequenti
Mi serve un plugin per aggiungere WhatsApp a WordPress? No. Puoi incollare uno script nel footer, aggiungere poche righe a functions.php oppure usare un blocco Pulsanti con un link. Un plugin evita soltanto di dover toccare il codice.
Funziona con WooCommerce? Sì. WooCommerce usa lo stesso tema del resto del sito, quindi il pulsante apparirà anche nel negozio.
Funziona su WordPress.com? Per aggiungere script o installare plugin su WordPress.com serve un piano che lo permetta. Un sito WordPress su hosting proprio non ha questo limite.
Posso cambiare numero senza modificare il sito? Con il widget o un link breve, sì: lo modifichi dalla bacheca e il pulsante punta già alla nuova destinazione. Con un link wa.me scritto a mano, dovresti aggiornarlo ovunque tu lo abbia incollato.
In sintesi
- Il pulsante flottante si installa incollando una riga di script prima di
</body>. - Inseriscilo nella parte del template Footer per i temi a blocchi, in un widget del footer per i temi classici, in
wp_footerdi un tema child oppure in un plugin per header e footer. - Un plugin dedicato evita il codice, ma richiede manutenzione: verifica che sia aggiornato.
- Per un pulsante statico, basta un blocco Pulsanti o un link personalizzato nel menu.
- Caricalo con
async, esegui un solo pulsante e controlla su mobile che non copra il banner dei cookie o il carrello. - Se non compare, svuota la cache ed escludi lo script dal ritardo di esecuzione JavaScript.
- Assegna al sito un link specifico e tracciane i clic.