Gli shortcode sono frammenti di codice racchiusi tra parentesi quadre che WordPress interpreta ed esegue per generare contenuti dinamici all’interno di post, pagine e widget. Introdotti in WordPress 2.5, permettono agli utenti di inserire funzionalit\u00e0 complesse senza scrivere codice PHP.<\/p>\n
La sintassi base \u00e8 Gli shortcode sono ideali per:<\/p>\n Oggi Gutenberg ha ridotto la necessit\u00e0 di shortcode per molti casi d’uso, ma rimangono preziosi per plugin, funzionalit\u00e0 legacy e integrazioni che devono funzionare anche con l’editor classico. Inoltre, gli shortcode possono essere usati all’interno di blocchi Gutenberg, rendendoli compatibili con entrambi gli editor.<\/p>\n Per creare uno shortcode, usa la funzione add_shortcode() che accetta due parametri: il nome dello shortcode (tag) e la funzione callback che ne genera l’output. La callback riceve tre parametri: $atts (array degli attributi), $content (contenuto racchiuso, se presente) e $tag (il nome dello shortcode).<\/p>\n Esempio base: uno shortcode che mostra la data corrente. La funzione restituisce la data formattata e WordPress la inserisce nel punto del contenuto in cui \u00e8 stato posizionato lo shortcode. Ricorda: la callback deve sempre restituire (return) l’output, non stamparlo (echo).<\/p>\n Gli attributi rendono gli shortcode flessibili e riutilizzabili. Usa shortcode_atts() per definire valori predefiniti e unirli con gli attributi passati dall’utente. Questa funzione garantisce che tutti gli attributi abbiano un valore e protegge da attributi non autorizzati.<\/p>\n Esempio: uno shortcode bottone che accetta attributi come colore, url e testo. shortcode_atts() imposta “blu” come colore predefinito, “#” come url predefinito e “Clicca qui” come testo predefinito. Se l’utente non specifica un attributo, viene usato il valore di default.<\/p>\n Sanitizza sempre gli attributi: usa esc_url() per URL, esc_attr() per valori da inserire in attributi HTML, intval() per numeri. Non fidarti mai dell’input dell’utente, anche se \u00e8 un amministratore.<\/p>\n Quando lo shortcode racchiude del contenuto tra tag di apertura e chiusura, la callback riceve il contenuto come secondo parametro ($content). Questo permette di creare wrapper: elementi che avvolgono e trasformano il contenuto esistente.<\/p>\n Esempio: uno shortcode [highlight]testo[\/highlight] che avvolge il testo in un elemento con sfondo giallo. La callback restituisce il contenuto originale racchiuso in un tag con classe CSS. Puoi combinare attributi e contenuto racchiuso: [highlight colore=”verde”]testo importante[\/highlight].<\/p>\n Usa sempre do_shortcode() sul contenuto racchiuso se vuoi permettere shortcode annidati. Senza do_shortcode(), gli shortcode all’interno del contenuto non vengono processati.<\/p>\n Uno shortcode per tabs permette di creare interfacce a schede nel contenuto. La struttura prevede uno shortcode contenitore [tabs] che racchiude pi\u00f9 shortcode [tab titolo=”Scheda 1″]contenuto[\/tab]. Il PHP genera HTML con classe JavaScript per l’interattivit\u00e0, includendo gli script necessari solo tramite wp_enqueue_script().<\/p>\n Simile ai tabs, l’accordion usa uno shortcode contenitore [accordion] e item [accordion-item titolo=”Domanda”]risposta[\/accordion-item]. Ogni item mostra un’intestazione cliccabile che rivela il contenuto. L’implementazione richiede JavaScript minimo, anche con CSS puro usando l’hack del checkbox.<\/p>\n[nomeshortcode]<\/code>. Gli shortcode possono accettare attributi ([nomeshortcode attr1=\"valore1\" attr2=\"valore2\"]<\/code>) e contenuto racchiuso ([nomeshortcode]contenuto[\/nomeshortcode]<\/code>). WordPress li processa durante il rendering della pagina, sostituendoli con l’output generato dal codice PHP associato.<\/p>\nQuando usare gli shortcode<\/h2>\n
\n
Creare il primo shortcode con add_shortcode()<\/h2>\n
Gestire gli attributi con shortcode_atts()<\/h2>\n
Shortcode con contenuto racchiuso<\/h2>\n
Shortcode complessi: esempi pratici<\/h2>\n
Tabs<\/h3>\n
Accordion<\/h3>\n
Bottoni<\/h3>\n