Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Coppa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

Come utilizzare gli shortcode nei temi WordPress

Nota editoriale: guadagniamo una commissione dai link dei partner su WPBeginner. Le commissioni non influenzano le opinioni o le valutazioni dei nostri redattori. Per saperne di più su Processo editoriale.

Volete utilizzare gli shortcode nel vostro tema WordPress?

Normalmente, si utilizzano gli shortcode all’interno di aree di contenuto come i post, le pagine o i widget della barra laterale. Tuttavia, a volte è possibile aggiungere uno shortcode all’interno del tema di WordPress.

In questo articolo vi mostreremo come aggiungere facilmente qualsiasi shortcode al vostro tema WordPress.

How to use shortcodes in your WordPress themes

Perché usare gli shortcode nei vostri temi WordPress?

Gli shortcode possono aggiungere ogni tipo di caratteristica al vostro sito web, tra cui gallerie di immagini, moduli, feed dei media e molto altro.

WordPress è dotato di alcuni shortcode integrati, ma ci sono anche molti plugin WordPress popolari che aggiungono shortcode al vostro sito.

Ad esempio, WPForms ha blocchi facili da usare, ma fornisce anche shortcode per aggiungere moduli ad altre aree del sito.

An example of a WordPress shortcode, provided by WPForms

Nella maggior parte dei casi, gli shortcode vengono aggiunti all’interno di aree di contenuto come le pagine e i post.

Per saperne di più, consultate la nostra guida completa su come aggiungere uno shortcode in WordPress.

Adding a shortcode block to a WordPress page or post

Tuttavia, a volte è possibile utilizzare uno shortcode all’interno dei file del tema di WordPress.

Ciò consente di aggiungere elementi dinamici ad aree che non si possono modificare con l’editor standard dei post di WordPress, come la pagina dell’archivio. È anche un modo semplice per utilizzare lo stesso shortcode su più pagine.

Ad esempio, si può aggiungere uno shortcode al modello di pagina o di post del tema.

Tenendo presente questo, vediamo come utilizzare gli shortcode nel vostro tema WordPress. Utilizzate i link rapidi qui sotto per passare direttamente al metodo che desiderate utilizzare:

Metodo 1: Utilizzo dell’editor del sito completo (solo per i temi a blocchi)

Il modo più semplice per utilizzare gli shortcode nel vostro tema WordPress è utilizzare l’editor completo del sito. In questo modo è possibile aggiungere un blocco di shortcode a qualsiasi parte del sito.

Tuttavia, questo metodo funziona solo con temi basati sui blocchi, come Hestia Pro. Se non si utilizza un tema abilitato ai blocchi, è necessario utilizzare un metodo diverso.

Per iniziare, andate su Aspetto ” Editor nella dashboard di WordPress.

Opening the WordPress full-site editor (FSE)

Per impostazione predefinita, l’editor completo del sito mostra il modello di home del tema, ma è possibile aggiungere shortcode a qualsiasi modello.

Per visualizzare tutte le opzioni disponibili, selezionare “Modelli”.

Adding shortcode to a WordPress template using the full-site editor

A questo punto è possibile fare clic sul modello che si desidera modificare.

A titolo di esempio, aggiungeremo uno shortcode al modello della pagina 404, ma i passaggi saranno esattamente gli stessi indipendentemente dal modello selezionato.

Adding a shortcode to a WordPress theme using a full-site editor (FSE)

A questo punto WordPress mostrerà un’anteprima del modello.

Per aggiungere un codice breve, fare clic sull’icona della matita.

Editing a WordPress theme's 404 template using the full-site editor (FSE)

A questo punto, fare clic sull’icona blu “+” nell’angolo in alto a sinistra.

Nella barra di ricerca, è necessario digitare “Shortcode”.

Adding a shortcode block to a WordPress theme

Quando appare il blocco giusto, trascinarlo sul modello del tema.

A questo punto è possibile incollare o digitare lo shortcode che si desidera utilizzare.

Adding Shortcode blocks to a WordPress theme

Dopodiché, fare clic sul pulsante “Salva”.

Ora è sufficiente visitare il vostro blog WordPress per vedere lo shortcode in azione.

An example of a shortcode, on a 404 page template

Metodo 2: Modifica dei file del tema WordPress (funziona con qualsiasi tema WordPress)

È anche possibile aggiungere shortcode al tema WordPress modificando i file del tema. Questo metodo è più avanzato, ma funziona con tutti i temi di WordPress.

Se non avete mai aggiunto codice al vostro sito, date un’occhiata alla nostra guida passo passo su come copiare e incollare codice in WordPress.

È possibile modificare direttamente i singoli file del tema, ma questo rende difficile aggiornare il tema WordPress senza perdere la personalizzazione. Per questo motivo, si consiglia di sovrascrivere i file del tema creando un tema figlio.

Se si sta creando un tema personalizzato, è possibile aggiungere o modificare il codice nei file del tema esistente.

Quando si modificano i file del tema, non è possibile aggiungere lo shortcode nello stesso formato utilizzato per le aree di contenuto standard. Invece di vedere l’output dello shortcode, si vedrà lo shortcode stesso sullo schermo.

Questo accade perché WordPress non esegue gli shortcode all’interno dei file modello dei temi. È invece necessario indicare esplicitamente a WordPress di eseguire lo shortcode utilizzando la funzione do_shortcode.

Per ulteriori informazioni, consultare la nostra guida su come aggiungere facilmente codice personalizzato.

Ecco un esempio del codice da aggiungere ai file del vostro tema WordPress:

echo do_shortcode('[gallery]');

È sufficiente sostituire ‘gallery’ con lo shortcode che si desidera utilizzare.

Se non siete sicuri di dove aggiungere lo shortcode, consultate la nostra guida per principianti sulla gerarchia dei template di WordPress.

Se si aggiunge uno shortcode con parametri aggiuntivi, è necessario utilizzare uno snippet di codice leggermente diverso.

Immaginate di aver creato un modulo di contatto utilizzando WPForms. In questo caso, dovrete usare lo shortcode standard di WPForms e l’ID del modulo:

echo do_shortcode("[wpforms id='92']");

Risoluzione dei problemi: Cosa fare quando do_shortcode non funziona

A volte capita di aggiungere uno shortcode a un file di tema, ma l’output del codice non compare sul sito web di WordPress. Questo di solito significa che lo shortcode dipende da un plugin di WordPress o da qualche altro codice presente sul sito web.

Se la funzione do_shortcode non funziona, accertarsi che il plugin che fornisce lo shortcode sia installato e attivato andando su Plugin ” Plugin installati.

Nell’immagine seguente, WPForms è installato ma disattivato, quindi il codice echo do_shortcode non funziona.

How to instal and activate a WordPress plugin

Si può anche verificare se uno shortcode è disponibile aggiungendo la funzione shortcode_exists() al file index.php.

Nel seguente snippet, controlliamo se lo snippet WPForms è disponibile per l’uso sul nostro sito web:

if ( shortcode_exists( 'wpforms' ))  {
  echo do_shortcode("[[wpforms id='147']]");
}

Se ancora non vedete lo shortcode sul vostro sito web, provate a svuotare la cache di WordPress, perché potreste vedere una versione non aggiornata del vostro sito.

Metodo 3: Creare il proprio tema WordPress (completamente personalizzabile)

Un’altra opzione è quella di creare un tema WordPress personalizzato. Si tratta di un metodo più avanzato, ma consente di aggiungere tutti gli shortcode che si desidera a qualsiasi area del tema WordPress. Potete anche apportare altre modifiche per creare esattamente le caratteristiche e il design che desiderate.

In passato, per creare un tema personalizzato per WordPress era necessario seguire un complicato tutorial o scrivere codice personalizzato. Tuttavia, ora è possibile creare un tema personalizzato senza scrivere una sola riga di codice utilizzando SeedProd.

SeedProd è il miglior costruttore di pagine per WordPress ed è dotato anche di un builder di temi, oltre a interi kit di siti e template. Questo vi permette di progettare i vostri temi usando la trascina e rilascia.

SeedProd's advanced theme builder feature

Per le istruzioni passo-passo, consultate la nostra guida su come creare un tema WordPress personalizzato (senza alcun codice).

Dopo aver creato un tema, è possibile aggiungere gli shortcode a qualsiasi parte del sito WordPress andando su SeedProd ” Theme Builder.

Custom WordPress theme templates

Qui, trovare il modello in cui si desidera utilizzare lo shortcode.

A questo punto, basta passare il mouse su quel modello e fare clic su “Modifica design” quando appare.

Creating a custom theme using SeedProd

Questo aprirà il template nel builder di SeedProd.

Nel menu di sinistra, scorrere fino alla sezione “Avanzate”. Qui, trovare il blocco Shortcode e trascinarlo nel layout.

Adding a Shortcode block to a theme using SeedProd

Nell’anteprima live, è sufficiente fare clic per selezionare il blocco Shortcode.

A questo punto è possibile aggiungere lo shortcode nella casella “Shortcode”.

Adding a contact form to a WordPress theme using shortcode

Per impostazione predefinita, SeedProd non mostra l’output dello shortcode nell’anteprima live.

Per vedere il vostro shortcode in azione, fate clic sulla levetta “Mostra opzione shortcode”.

Previewing the shortcode output in SeedProd

Successivamente, si può aggiungere un po’ di stile all’output dello shortcode selezionando la scheda “Avanzate”.

Qui è possibile modificare la spaziatura, aggiungere CSS personalizzati e persino aggiungere effetti di animazione CSS.

Styling shortcode output using the SeedProd theme builder

Quando si è soddisfatti dell’aspetto della pagina, basta fare clic sul pulsante “Salva”.

Quindi, selezionare “Pubblica” per rendere attivo lo shortcode.

Publishing a custom WordPress theme using SeedProd

Ora è possibile visitare il proprio sito web per vedere lo shortcode personalizzato in azione.

Speriamo che questo tutorial vi abbia aiutato a imparare a usare gli shortcode nei vostri temi WordPress. Potreste anche voler selezionare la nostra guida su come creare una landing page in WordPress e le nostre verifiche sui widget più utili per il vostro sito.

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

Divulgazione: I nostri contenuti sono sostenuti dai lettori. Ciò significa che se cliccate su alcuni dei nostri link, potremmo guadagnare una commissione. Vedi come WPBeginner è finanziato , perché è importante e come puoi sostenerci. Ecco il nostro processo editoriale .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Il kit di strumenti WordPress definitivo

Ottenete l'accesso gratuito al nostro kit di strumenti - una raccolta di prodotti e risorse relative a WordPress che ogni professionista dovrebbe avere!

Reader Interactions

29 commentiLascia una risposta

  1. Syed Balkhi says

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Jiří Vaněk says

    Is there a way to create a shortcode myself, rather than just inserting one that’s already created by a plugin? Let me give an example. I create a piece of code that I don’t necessarily want to insert everywhere as PHP code. Can I turn that code into a shortcode, which I then simply insert in the desired location, and the entire PHP code hidden within that shortcode gets executed there?

  3. pankaj says

    I deleted contact form 7 and it is giving error like this [contact-form-7 404 “Not Found”] I don’t want to use the form again but want to remove this error I don’t know where to find that code or shortcode in template file

  4. Sonik says

    hi,

    I have written a shortcode of a gallery plugin in wordpress visual editor, but it is not executing the shortcode, instead it displays the shortcode as it is written.

    like if I write [test attr=’hello’], it echoes the same on webpage, not executing.

    Thanks.

  5. DavidA says

    Hello, I have two wordpress blogs on multisite.
    Do you know, how to use the shortcode on the website 1 from the website 2 ?
    Thx

  6. Dean says

    Sorry here is the code:

    CODE: ——————————————————————————————

    echo do_shortcode(“[tabset tab1=”tab 1 title” tab2=”tab 2 title”]
    [tab]tab 1 content[/tab]

    [tab]tab 2 content[/tab]
    [/tabset]”);

    —————————————————————————————————-

  7. Tim says

    Great info. Thanks! However, it’s not working for me in WordPress 3.5.1 using the Avada theme.

    Do you need to add anything to functions.php for the code above to work? Could this be a theme-specific issue? Thanks, just learning wordpress templating.

  8. Tyron says

    This is a great little tip. How would this work if your content needs to be wrapped in a shortcode?

    Like [shortcode-name]Content here[/shortcode-name].

    • Jonathon Harris says

      Tyron,
      This a late answer as I’m just seeing it, but to include wrapped content, you could do the following:

      echo do_shortcode(‘[example_shortcode]’.$text_to_be_wrapped_in_shortcode.'[/example_shortcode]’);

      Cheers,
      J

  9. Keith Davis says

    Hi boys
    Where do you add the code…

    What file do you add it to and where abouts in the file?

    My theme already uses shortcodes but it would still be interesting to know.

Lascia una risposta

Grazie per aver scelto di lasciare un commento. Tenga presente che tutti i commenti sono moderati in base alle nostre politica dei commenti e il suo indirizzo e-mail NON sarà pubblicato. Si prega di NON utilizzare parole chiave nel campo del nome. Avremo una conversazione personale e significativa.