Gli shortcode sono una delle funzionalità più potenti e sottovalutate di WordPress. Se hai mai desiderato aggiungere elementi dinamici ai tuoi contenuti senza dover scrivere codice complesso, questa guida fa per te.
In questo articolo scoprirai cosa sono gli shortcode, come funzionano, dove puoi inserirli e come crearne di personalizzati per il tuo sito.
Cosa sono gli shortcode di WordPress?
Uno shortcode è un piccolo frammento di codice racchiuso tra parentesi quadre che WordPress trasforma automaticamente in contenuti più complessi. In pratica, funziona come una scorciatoia: invece di scrivere decine di righe di HTML o PHP, ti basta inserire qualcosa come:
WordPress riconosce questo tag e lo sostituisce con una galleria immagini completa, senza che tu debba preoccuparti del codice sottostante.
Il nome stesso lo spiega: shortcode significa “codice abbreviato” (short + code). È un modo semplice ed elegante per inserire funzionalità avanzate nei tuoi articoli, pagine e widget.
Perché sono stati creati gli shortcode?
WordPress filtra tutti i contenuti per motivi di sicurezza, impedendo l’esecuzione di codice PHP direttamente negli articoli. Questa scelta protegge il tuo sito da potenziali vulnerabilità, ma limita anche le possibilità creative.
Gli shortcode sono nati nel 2008 con WordPress 2.5 proprio per risolvere questo problema. Grazie alla Shortcode API, gli sviluppatori possono creare funzioni PHP complesse e renderle accessibili a tutti attraverso semplici tag tra parentesi quadre.
Il risultato? Anche chi non ha competenze di programmazione può inserire moduli di contatto, slider, tabelle prezzi e molto altro semplicemente copiando e incollando uno shortcode.
I due tipi di shortcode
Esistono due categorie principali di shortcode in WordPress.
Shortcode auto-chiudenti (self-closing)
Questi shortcode non richiedono un tag di chiusura. Funzionano da soli e si usano così:
Tutto ciò che serve viene specificato attraverso gli attributi.
Shortcode a contenitore (enclosing)
Questi shortcode avvolgono del contenuto e richiedono un tag di apertura e uno di chiusura:
Questa è la didascalia della mia immagineIl contenuto tra i due tag viene elaborato e modificato dallo shortcode.
Gli shortcode predefiniti di WordPress
WordPress include alcuni shortcode nativi che puoi usare subito senza installare plugin:
[audio] permette di incorporare file audio con controlli di riproduzione basilari come play e pausa.
[video] funziona in modo simile per i file video, supportando formati come mp4, webm, ogv e altri.
[gallery] crea una galleria fotografica a partire dalle immagini caricate nella libreria media. Puoi specificare quali immagini mostrare, il numero di colonne e la dimensione delle miniature.
[caption] aggiunge didascalie a immagini o altri elementi HTML.
[embed] ti permette di incorporare contenuti da servizi esterni come YouTube o Twitter con maggiore controllo rispetto all’embed automatico.
[playlist] visualizza una raccolta di file audio o video come playlist.
Dove inserire gli shortcode
In articoli e pagine
Se utilizzi l’editor a blocchi Gutenberg, cerca il blocco “Shortcode” nella sezione Widget e inserisci il tuo shortcode al suo interno.
Con l’editor classico, puoi semplicemente incollare lo shortcode direttamente nell’area di contenuto, sia in modalità visuale che testuale.
Nei widget della sidebar
Vai su Aspetto → Widget e aggiungi un widget Shortcode (o un widget Testo nelle versioni precedenti alla 4.9). Incolla il tuo shortcode e salva.
Nei file del tema
Se vuoi inserire uno shortcode nei file template del tuo tema (header.php, footer.php, ecc.), devi usare la funzione PHP dedicata:
<?php echo do_shortcode('[nome_shortcode]'); ?>Ricorda di includere le parentesi quadre all’interno delle virgolette, altrimenti non funzionerà.
Come funzionano gli shortcode (dietro le quinte)
Quando WordPress elabora il contenuto di una pagina, cerca tutti gli shortcode registrati. Quando ne trova uno, esegue la funzione PHP associata e sostituisce lo shortcode con il risultato generato.
Questo processo avviene automaticamente grazie alla Shortcode API, che gestisce tutta la logica di parsing e sostituzione.
Creare uno shortcode personalizzato
Vediamo come creare un semplice shortcode che mostra l’anno corrente. È utile per i copyright nel footer, che così si aggiorneranno automaticamente ogni anno.
Aggiungi questo codice nel file functions.php del tuo tema o in un plugin:
function mostra_anno_corrente() {
return date('Y');
}
add_shortcode('anno', 'mostra_anno_corrente');Ora puoi usare [anno] ovunque nel tuo sito per visualizzare “[anno]”.(per scrivere [anno] fra virgolette ho usato proprio lo shortcode. In questo modo vedrai la data aggiornata all’anno corrente, indipendentemente dall’anno di scrittura dell’articolo, senza che io debba aggiornare nulla).
Shortcode con attributi
Gli attributi permettono di personalizzare il comportamento di uno shortcode. Ecco un esempio di bottone CTA personalizzabile:
function bottone_cta($atts) {
$a = shortcode_atts(array(
'link' => '#',
'testo' => 'Clicca qui',
'colore' => 'blue'
), $atts);
return '<a href="' . esc_url($a['link']) . '" class="button ' . esc_attr($a['colore']) . '">' . esc_attr($a['testo']) . '</a>';
}
add_shortcode('bottone', 'bottone_cta');Puoi usarlo così:
[bottone link="https://esempio.it" testo="Scopri di più" colore="verde"]La funzione shortcode_atts combina gli attributi inseriti dall’utente con i valori predefiniti che hai specificato.
Shortcode con contenuto
Per creare uno shortcode che avvolge del contenuto, aggiungi il parametro $content alla funzione:
function box_evidenziato($atts, $content = null) {
$a = shortcode_atts(array(
'colore' => '#f0f0f0'
), $atts);
return '<div style="background-color:' . esc_attr($a['colore']) . '; padding: 20px; border-radius: 5px;">' . $content . '</div>';
}
add_shortcode('box', 'box_evidenziato');Si usa così:
[box colore="#ffffcc"]Questo testo apparirà su sfondo giallo[/box]E il risultato è questo:
[box colore=”#ffffcc”]Questo testo apparirà su sfondo giallo[/box]
Vantaggi degli shortcode
Gli shortcode semplificano l’aggiunta di funzionalità complesse senza richiedere competenze di programmazione. Sono riutilizzabili: una volta creato lo shortcode, puoi inserirlo ovunque con un semplice copia-incolla.
Se includi gli shortcode in un plugin, continueranno a funzionare anche cambiando tema. Questo li rende particolarmente utili per elementi che vuoi mantenere indipendenti dal design del sito.
Grazie agli attributi, lo stesso shortcode può produrre risultati diversi a seconda delle esigenze, offrendo grande flessibilità.
Limiti e svantaggi
Gli shortcode non sono particolarmente intuitivi per gli utenti finali. Guardando [gallery ids="47,86,92" columns="4"] non è immediato capire cosa produrrà.
Se uno shortcode è definito nel tema e cambi tema, smetterà di funzionare e vedrai il codice grezzo nei tuoi contenuti.
Troppi shortcode in una pagina possono rallentare il caricamento, poiché ciascuno richiede elaborazione da parte del server.
Shortcode e blocchi Gutenberg
Con l’introduzione dell’editor Gutenberg, WordPress si è orientato verso i blocchi come sistema principale per aggiungere contenuti dinamici. I blocchi offrono un’interfaccia visuale più intuitiva rispetto agli shortcode testuali.
Molti plugin stanno convertendo i loro shortcode in blocchi dedicati. Tuttavia, gli shortcode rimangono pienamente supportati e Gutenberg include un blocco apposito per inserirli.
Se stai sviluppando nuove funzionalità, valuta se creare un blocco invece di uno shortcode. Ma per progetti esistenti o situazioni in cui la semplicità è prioritaria, gli shortcode restano una scelta valida.
Plugin utili per gli shortcode
Esistono diversi plugin che estendono le funzionalità degli shortcode in WordPress:
Shortcodes Ultimate offre una collezione di oltre 50 shortcode pronti all’uso per pulsanti, box, tabs, accordion, mappe e molto altro.
WPCode (ex Insert Headers and Footers) permette di gestire snippet di codice e shortcode personalizzati senza modificare i file del tema.
Shortcoder ti consente di creare shortcode personalizzati direttamente dal pannello di amministrazione, senza scrivere codice PHP.
Conclusioni
Gli shortcode rappresentano uno strumento potente per aggiungere funzionalità dinamiche al tuo sito WordPress. Che tu voglia inserire un semplice anno corrente o costruire elementi complessi come gallerie e moduli, gli shortcode ti permettono di farlo con pochi caratteri.
Sebbene l’editor a blocchi stia gradualmente sostituendo alcune applicazioni degli shortcode, questi ultimi rimangono una risorsa preziosa nel toolkit di ogni sviluppatore WordPress. Sono particolarmente utili quando lavori con plugin esistenti, quando hai bisogno di massima compatibilità o quando preferisci un approccio testuale alla creazione dei contenuti.
Inizia sperimentando con gli shortcode predefiniti di WordPress, poi passa a creare i tuoi personalizzati man mano che acquisisci familiarità con il sistema. Con un po’ di pratica, scoprirai che gli shortcode possono semplificare notevolmente la gestione del tuo sito.
