Stavo costruendo un sito in Elementor. Avevo i numeri di telefono salvati in un campo ACF. Dovevo trasformarli in link cliccabili — quelli con tel: che su mobile aprono direttamente il dialer. Elementor non lo permette. Non puoi prendere un dato dinamico da ACF e infilarlo dentro l’attributo href di un link. Almeno non in modo nativo.
Ho scritto un plugin. Si chiama “Phone Link Shortcode” e fa esattamente questo: prende il numero dal campo ACF, lo pulisce, lo formatta con il prefisso internazionale, e lo trasforma in un link cliccabile. Funziona ovunque inserisci uno shortcode, non solo in Elementor.
Il Problema
La limitazione è specifica ma fastidiosa. In Elementor puoi usare i dati dinamici di ACF per mostrare contenuti — testi, immagini, date — ma quando si tratta di link, le opzioni si restringono. Puoi linkare a pagine, post, URL personalizzati. Ma non puoi dire “prendi questo campo ACF e usalo come destinazione di un link”.
Per i numeri di telefono questo è particolarmente scomodo. Hai il numero nel campo, lo mostri a schermo, ma l’utente deve copiarlo e incollarlo nell’app telefono. Su desktop è tollerabile, su mobile è un’esperienza pessima.
Le alternative esistenti non risolvono il problema. Puoi scrivere HTML direttamente nel widget di testo — funziona, ma significa hardcodare il numero, perdendo la flessibilità di ACF. Oppure modifichi il template PHP del tema, ma non tutti hanno voglia o competenze per entrare nel codice del tema. E se cambi tema, ricominci da capo.
Serviva qualcosa di più pulito. Qualcosa che funzionasse indipendentemente dal tema, che non richiedesse modifiche ai template, e che restasse semplice da usare per chiunque gestisce il sito.
Ideazione: Function vs Plugin
La prima idea era scrivere una funzione PHP e inserirla nel functions.php del tema. È la soluzione più rapida: definisci uno shortcode, scrivi la logica per recuperare il campo ACF e formattare il link, salvi il file. Dieci minuti di lavoro, problema risolto.
Ma il functions.php ha i suoi limiti. Primo: è legato al tema. Cambi tema e perdi la funzione. Secondo: non tutti si sentono a proprio agio a modificare file PHP, soprattutto se il sito è già in produzione. Un errore di sintassi e il sito va in white screen. Terzo: non è portabile. Se devi replicare la soluzione su altri progetti, devi ricopiare il codice ogni volta.
Ho scelto di fare un plugin perché è più robusto. Un plugin è indipendente dal tema, può essere attivato e disattivato senza toccare codice, e se qualcosa va storto puoi semplicemente disattivarlo dalla dashboard. Inoltre, rende il codice riutilizzabile: una volta scritto, lo carichi su altri siti quando serve.
Non è una questione di complessità. Il codice del plugin è praticamente identico alla funzione che avresti nel functions.php. È una questione di praticità e manutenibilità.
La Soluzione: Il Codice Spiegato
Il plugin si compone di tre parti principali: la definizione del plugin, il controllo delle dipendenze, e la logica dello shortcode. Partiamo dall’inizio.
Definizione del Plugin
<?php
/*
Plugin Name: Phone Link Shortcode
Plugin URI: https://bcreativeanddesign.it
Description: Converte un numero di telefono da ACF in un link cliccabile.
Version: 1.0
Author: Vincenzo Piacente
Author URI: https://vincenzopiacente.it
*/
Questo blocco di commenti non è solo documentazione. WordPress lo legge per identificare il plugin nel pannello di amministrazione. Senza questi metadati, WordPress non riconosce il file come plugin e non lo mostra nella lista dei plugin installati.
Ogni campo ha uno scopo. Plugin Name è il nome che appare nella dashboard. Description spiega cosa fa. Version serve per tracciare aggiornamenti. Niente di magico, solo metadati che WordPress usa per organizzare i plugin.
Controllo delle Dipendenze
if (function_exists('get_field')) {
add_shortcode('phone_link', 'wt_phone_number_to_link');
} else {
add_action('admin_notices', function() {
echo '<div class="notice notice-warning is-dismissible">
<p><strong>Phone Link Shortcode</strong> richiede <strong>Advanced Custom Fields</strong> attivo.</p>
</div>';
});
}
Questo controllo serve a prevenire errori. Il plugin dipende da ACF per funzionare — senza ACF, la funzione get_field() non esiste e il codice genera un fatal error.
Prima di registrare lo shortcode, verifichiamo che get_field() sia disponibile. Se lo è, registriamo lo shortcode phone_link e lo leghiamo alla funzione wt_phone_number_to_link(). Se non lo è, mostriamo un avviso nella dashboard per informare l’utente che serve ACF.
Questo tipo di controllo è buona pratica. Evita crash silenziosi e rende più chiaro cosa sta andando storto se qualcosa non funziona.
La Logica dello Shortcode
function wt_phone_number_to_link() {
$phone_number = get_field('numero_di_telefono');
if (!$phone_number) {
return '';
}
$clean_number = preg_replace('/[^0-9]/', '', $phone_number);
if (substr($clean_number, 0, 2) !== '39') {
$clean_number = '39' . $clean_number;
}
if (strlen($clean_number) >= 12) {
$formatted_number = '+' . substr($clean_number, 0, 2) . ' ' .
substr($clean_number, 2, 3) . ' ' .
substr($clean_number, 5, 3) . ' ' .
substr($clean_number, 8);
} else {
$formatted_number = '+' . $clean_number;
}
return '<a href="tel:' . $clean_number . '">' . $formatted_number . '</a>';
}
Questa è la funzione che fa il lavoro vero. Analizziamola per blocchi.
Recupero del campo. get_field('numero_di_telefono') prende il valore dal campo ACF chiamato numero_di_telefono. Questo nome è arbitrario — nel tuo progetto potrebbe chiamarsi phone, telefono, contact_number. L’importante è che corrisponda al nome che hai dato al campo nella configurazione di ACF.
Se il campo è vuoto o non esiste, la funzione restituisce una stringa vuota e si ferma. Niente campo, niente output. Semplice.
Pulizia del numero. preg_replace('/[^0-9]/', '', $phone_number) rimuove tutto ciò che non è una cifra. Se nel campo hai salvato +39 333 123 4567 o (333) 123-4567, questa regex lo trasforma in 3331234567. Il link tel: ha bisogno solo di numeri. Spazi, trattini, parentesi — tutto il resto è rumore.
Aggiunta del prefisso. Controlliamo se il numero inizia con 39, che è il prefisso internazionale dell’Italia. Se non c’è, lo aggiungiamo. Questo assicura che il link funzioni anche per chiamate internazionali. Se il tuo pubblico è prevalentemente italiano, ha senso. Se lavori con numeri di altri paesi, dovrai adattare questa logica.
Formattazione per la leggibilità. Il numero pulito diventa +39 333 123 4567. Questa formattazione è solo estetica — serve per rendere il numero più leggibile a schermo. Il link usa sempre $clean_number (solo cifre), mentre il testo visibile usa $formatted_number (con spazi).
Il controllo su strlen($clean_number) >= 12 serve a evitare errori se il numero è troppo corto. Se per qualche motivo hai un numero con meno di 12 cifre, la formattazione non va a buon fine e il plugin restituisce il numero così com’è, con solo il prefisso +.
Output finale. return '<a href="tel:' . $clean_number . '">' . $formatted_number . '</a>'; genera il link HTML. L’attributo href contiene il numero pulito (solo cifre), il testo del link mostra il numero formattato (con spazi). Su mobile, cliccare il link apre il dialer precompilato. Su desktop, dipende dal sistema operativo — alcuni aprono Skype o FaceTime, altri non fanno nulla.
Installazione e Utilizzo
Per usare il plugin, crei un file chiamato phone-link-shortcode.php, ci incolli il codice completo, e lo carichi nella directory wp-content/plugins/ del tuo sito. A quel punto appare nella lista dei plugin nella dashboard di WordPress. Lo attivi.
Una volta attivato, puoi usare lo shortcode [phone_link] ovunque WordPress accetti shortcode. In un widget di testo, in un blocco Gutenberg, dentro Elementor — se il builder supporta shortcode, funziona.
In Elementor usi il widget “Shortcode”, ci scrivi dentro [phone_link], e il plugin fa il resto. Non serve configurazione. Non ci sono opzioni. Inserisci lo shortcode, il plugin prende il numero dal campo ACF del post o della pagina corrente, e lo trasforma in link.
Se devi usare un campo diverso da numero_di_telefono, modifichi il nome nella riga get_field('numero_di_telefono'). Se lavori con numeri di paesi diversi dall’Italia, togli o adatti la logica del prefisso 39. È codice semplice, modificarlo richiede solo cambiare qualche stringa.
Quando Ha Senso Usarlo
Questa soluzione ha senso se lavori regolarmente con ACF ed Elementor, e hai bisogno di link telefonici cliccabili su più pagine o progetti. Non è indispensabile — puoi sempre scrivere il link a mano in HTML — ma diventa comodo quando devi gestire decine di pagine o siti dove i numeri cambiano spesso.
Ha senso anche se non sei tu a gestire il sito a lungo termine. Con questo plugin, chi aggiorna il sito può cambiare il numero modificando il campo ACF, senza toccare codice o shortcode. Il link si aggiorna automaticamente.
Non ha senso se usi altri page builder che già supportano questa funzionalità nativamente, o se il numero di telefono è sempre lo stesso su tutto il sito — in quel caso un semplice menu o widget con link hardcodato è più semplice.
Io lo uso ancora su alcuni progetti dove gestisco siti per clienti che hanno bisogno di aggiornare numeri di telefono, orari, indirizzi senza entrare nel codice. Il plugin fa una cosa sola, la fa bene, e non crea overhead.
Note Finali
Il codice completo è disponibile. Puoi scaricarlo, modificarlo, usarlo come base per altri shortcode simili — email cliccabili, indirizzi formattati, qualsiasi dato da ACF che deve diventare un link o un elemento HTML specifico.
Non è un plugin complesso. Non ha interfaccia admin, non ha opzioni, non si integra con nient’altro. Fa una cosa: prende un numero, lo pulisce, lo formatta, lo trasforma in link. Questo lo rende facile da capire, facile da modificare, e difficile da rompere.
Se ti ritrovi con lo stesso problema — hai un dato in ACF, devi trasformarlo in qualcosa di specifico, e il tuo page builder non lo permette — la struttura è sempre la stessa. Uno shortcode, una funzione che recupera il campo, una logica per trasformare il dato, e un output. Il resto è solo adattare la logica al tuo caso specifico.