Come aggiungere uno shortcode in WordPress (Guida per principianti)

Immaginate di poter aggiungere nuove cose al vostro sito web WordPress, come slideshow, moduli di contatto o persino elenchi speciali, digitando un semplice codice. Questo è il potere degli shortcode.

Molti plugin e temi di WordPress possono utilizzare gli shortcode per aggiungere caratteristiche extra al sito. Molti dei nostri lettori ci chiedono il modo migliore per aggiungerli alle loro pagine, ai post e alla barra laterale.

In questo articolo vi mostreremo come utilizzare gli shortcode sul vostro sito web WordPress, passo dopo passo. Vi mostreremo anche come creare shortcode personalizzati se volete essere davvero creativi.

Cosa sono gli shortcode?

Glishortcode in WordPress sono scorciatoie di codice che consentono di aggiungere contenuti dinamici ai post, alle pagine e ai widget della barra laterale di WordPress. Vengono visualizzati all’interno di parentesi quadre come in questo caso:

[myshortcode]

Per capire meglio gli shortcode, diamo un’occhiata ai motivi per cui sono stati aggiunti in primo luogo.

WordPress filtra tutti i contenuti per assicurarsi che nessuno usi i post e i contenuti delle pagine per inserire codice dannoso nel database. Ciò significa che è possibile scrivere HTML di base nei post, ma non è possibile scrivere codice PHP.

Ma se si volesse eseguire del codice personalizzato all’interno dei post per visualizzare post correlati, banner pubblicitari, moduli di contatto, gallerie o altro?

È qui che entra in gioco l’API Shortcode.

In pratica, consente agli sviluppatori di aggiungere il proprio codice all’interno di una funzione e di registrare tale funzione in WordPress come shortcode, in modo che gli utenti possano utilizzarla facilmente senza avere alcuna conoscenza di codifica.

Quando WordPress trova lo shortcode, esegue automaticamente il codice ad esso associato.

Vediamo come aggiungere facilmente gli shortcode ai post e alle pagine di WordPress. Potete utilizzare i link sottostanti per passare al metodo che preferite.

Aggiunta di uno shortcode nei post e nelle pagine di WordPress

Per prima cosa, è necessario modificare il post e la pagina in cui si desidera aggiungere lo shortcode.

Successivamente, è necessario fare clic sul pulsante di aggiunta del blocco ‘+’ per inserire un blocco Shortcode.

Dopo aver aggiunto il blocco Shortcode, è sufficiente inserire lo shortcode nelle impostazioni del blocco.

Lo shortcode sarà fornito da vari plugin di WordPress che potreste utilizzare, come WPForms per i moduli di contatto o OptinMonster per l’email marketing.

Per saperne di più sull’uso dei blocchi, consultare il nostro tutorial su Gutenberg per maggiori dettagli.

Ora è possibile salvare il post o la pagina e visualizzare l’anteprima delle modifiche per vedere lo shortcode in azione.

Aggiunta di uno shortcode nei widget della barra laterale di WordPress

È inoltre possibile utilizzare gli shortcode nei widget della barra laterale di WordPress.

È sufficiente visitare la pagina Aspetto ” Widget e aggiungere un blocco di widget ‘Shortcode’ a una barra laterale.

A questo punto, è possibile incollare lo shortcode nell’area di testo del widget.

Non dimenticate di fare clic sul pulsante “Aggiorna” per memorizzare le impostazioni del widget.

Dopodiché, potete visitare il vostro sito web WordPress per vedere l’anteprima live dello shortcode nel widget della barra laterale.

Aggiunta di uno shortcode nel vecchio editor classico di WordPress

Se state ancora utilizzando il vecchio editor classico di WordPress, ecco come potete aggiungere gli shortcode ai vostri post e pagine di WordPress.

È sufficiente modificare il post e la pagina in cui si desidera aggiungere lo shortcode. È possibile incollare lo shortcode in qualsiasi punto dell’editor di contenuti in cui si desidera visualizzarlo. Assicuratevi solo che lo shortcode sia nella sua riga.

Non dimenticate di salvare le modifiche. Dopodiché, è possibile visualizzare l’anteprima del post e della pagina per vedere lo shortcode in azione.

Aggiunta di uno shortcode nei file del tema di WordPress

Gli shortcode sono destinati a essere utilizzati all’interno di post, pagine e widget di WordPress. Tuttavia, a volte è possibile utilizzare uno shortcode all’interno di un file di tema di WordPress.

WordPress consente di farlo facilmente, ma è necessario modificare i file del tema di WordPress. Se non l’avete mai fatto prima, consultate la nostra guida su come copiare e incollare il codice in WordPress.

In pratica, è possibile aggiungere uno shortcode a qualsiasi modello di tema WordPress semplicemente aggiungendo il seguente codice:

<?php echo do_shortcode('[your_shortcode]'); ?>

A questo punto WordPress cercherà lo shortcode e ne visualizzerà l’output nel modello del tema.

Aggiunta di uno shortcode nei file del tema a blocchi con l’editor del sito completo

Se si utilizza un tema a blocchi, sarà più facile aggiungere shortcode nei file del tema WordPress utilizzando l’editor del sito.

È possibile accedere a questo strumento selezionando Aspetto ” Editor dalla dashboard di WordPress.

Per impostazione predefinita, viene visualizzato il modello di home del tema; è possibile passare ad altri modelli selezionando l’opzione “Modelli”.

Una volta scelto un modello, è possibile iniziare a modificarlo facendo clic nel riquadro destro dell’editor. L’editor riempirà lo schermo.

A questo punto è possibile fare clic sull’icona ‘+’ dell’inseritore di blocchi e cercare il blocco shortcode. Dopodiché, è sufficiente trascinarlo sul modello e digitare lo shortcode che si desidera utilizzare.

Non dimenticate di fare clic sul pulsante “Salva” nella parte superiore della schermata per memorizzare le modifiche.

Creare uno shortcode personalizzato in WordPress

Gli shortcode possono essere molto utili quando si desidera aggiungere contenuti dinamici o codice personalizzato all’interno dei post e delle pagine di WordPress. Tuttavia, se si desidera creare uno shortcode personalizzato, è necessaria una certa esperienza di codifica.

Se si ha dimestichezza con la scrittura di codice PHP, ecco un esempio di codice che si può usare come modello:

// function that runs when shortcode is called
function wpb_demo_shortcode() { 
 
// Things that you want to do.
$message = 'Hello world!'; 
 
// Output needs to be return
return $message;
}
// register shortcode
add_shortcode('greeting', 'wpb_demo_shortcode');

In questo codice, abbiamo prima creato una funzione che esegue del codice e restituisce l’output. Successivamente, abbiamo creato un nuovo shortcode chiamato ‘greeting’ e abbiamo detto a WordPress di eseguire la funzione creata.

È possibile aggiungere questo codice al file functions.php del tema manualmente o utilizzare un plugin di snippet di codice come WPCode.

Per maggiori dettagli, potete consultare la nostra guida all’aggiunta di codice personalizzato in WordPress senza rompere nulla.

Una volta fatto ciò, è possibile aggiungere questo shortcode ai post, alle pagine e ai widget utilizzando il seguente codice:

[saluto]

Eseguirà la funzione creata e mostrerà l’output desiderato.

Vediamo ora un utilizzo più pratico di uno shortcode.

In questo esempio, visualizzeremo un banner di Google AdSense all’interno di uno shortcode:

// The shortcode function
function wpb_demo_shortcode_2() { 
 
// Advertisement code pasted inside a variable
$string .= '<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:block; text-align:center;"
     data-ad-format="fluid"
     data-ad-layout="in-article"
     data-ad-client="ca-pub-0123456789101112"
     data-ad-slot="9876543210"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script>';
 
// Ad code returned
return $string; 
 
}
// Register shortcode
add_shortcode('my_ad_code', 'wpb_demo_shortcode_2'); 

Non dimenticate di sostituire il codice dell’annuncio con il vostro codice dell’annuncio.

È ora possibile utilizzare lo shortcode [my_ad_code] all’interno dei post, delle pagine e dei widget della barra laterale di WordPress. WordPress eseguirà automaticamente la funzione associata al codice breve e visualizzerà il codice dell’annuncio.

Shortcodes vs. Blocchi Gutenberg

Gli utenti ci chiedono spesso quali siano le differenze tra gli shortcode e i blocchi di Gutenberg.

In sostanza, i blocchi consentono di fare le stesse cose degli shortcode, ma in modo più semplice.

Invece di richiedere agli utenti di aggiungere uno shortcode per la visualizzazione di contenuti dinamici, i blocchi consentono agli utenti di aggiungere contenuti dinamici all’interno di post/pagine con un’interfaccia utente più intuitiva. Molti dei più popolari plugin di WordPress sono passati a utilizzare i blocchi invece degli shortcode perché sono più facili da usare per i principianti.

Abbiamo messo insieme un elenco dei più utili plugin di blocco Gutenberg per WordPress che potreste voler provare.

Se volete creare i vostri blocchi Gutenberg personalizzati, potete seguire il nostro tutorial passo-passo su come creare blocchi Gutenberg personalizzati in WordPress.

Speriamo che questo articolo vi abbia aiutato a capire come aggiungere uno shortcode in WordPress. Potreste anche voler consultare la nostra guida su come creare un tema WordPress personalizzato senza scrivere alcun codice e la nostra scelta dei migliori plugin drag-and-drop per il page builder di WordPress.

Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.