Skip to content

Tutto per WordPress, lo sviluppo web — e non solo

📝 Come aggiungere codice personalizzato a un sito WordPress

📝 Come aggiungere codice personalizzato a un sito WordPress

Un sito WordPress funziona bene, ma vuoi qualcosa in più: togliere la data da un blocco specifico, cambiare il font nei titoli, aggiungere microdati che il tuo tema non supporta. Ti suona familiare? Ogni proprietario di un sito WP prima o poi si scontra con i limiti di temi e plugin. Ecco cinque modi sicuri per aggiungere il tuo codice, dall'installazione di un plugin in un minuto alla scrittura di un tuo mini-plugin.

Il web è pieno di snippet PHP e CSS già pronti per qualsiasi esigenza. Il problema non è trovare il codice, ma dove metterlo per non mandare in crash il sito al prossimo aggiornamento del tema. Abbiamo raccolto tutti i metodi funzionanti in un unico posto, con indicazioni precise su dove intervenire, avvertenze ed esempi.

💡 Panoramica rapida:

  • Installa WPCode o Code Snippets, il metodo più sicuro per i principianti: il codice non si perde quando cambi tema e ogni snippet può essere attivato o disattivato singolarmente.
  • Se modifichi solo CSS, parti dal Personalizzatore (Aspetto → Personalizza → CSS aggiuntivo), è integrato in WordPress e non richiede plugin.
  • Per modifiche a functions.php e ai template, crea un tema child: così conservi le tue modifiche quando il tema principale si aggiorna.
  • Quando gli snippet si accumulano o modificano la logica del sito a livello globale, raccoglili in un tuo plugin.

Metodo 1: plugin per l'inserimento di snippet

Interfaccia del plugin Code Snippets per WordPress

Il metodo più sicuro per un principiante, un plugin dedicato alla gestione degli snippet. Inserisci PHP, CSS o JavaScript nell'amministrazione tramite un normale campo di testo e il plugin esegue il codice dove serve. Se il codice contiene un errore, questo tipo di plugin intercetta l'errore fatale e disattiva automaticamente lo snippet, il sito non va in crash e non perdi l'accesso al pannello di amministrazione.

Due principali candidati nel 2026:

WPCode (ex Insert Headers and Footers), il più diffuso, oltre 2 milioni di installazioni attive e una valutazione di 4,9 su WordPress.org. La versione gratuita può inserire codice nell'header, nel footer, prima e dopo il contenuto. La versione Pro aggiunge logica condizionale (mostra uno snippet solo in certe pagine), un generatore di snippet tramite descrizione e una libreria di soluzioni già pronte.

Code Snippets, oltre 700.000 installazioni, valutazione 4,8. Completamente gratuito, con un editor grafico e evidenziazione della sintassi. Gli snippet sono salvati nel database e non dipendono dal tema. Puoi esportare un set di snippet in JSON e trasferirli su un altro sito.

Entrambi i plugin funzionano con lo stesso principio: crei un nuovo snippet, scegli il tipo di codice (PHP / CSS / JS), incolli il codice e clicchi su "Attiva". Se lo snippet causa un errore fatale, WordPress lo disattiva automaticamente alla richiesta successiva, la schermata bianca della morte non ti minaccerà.

Prima di inserire qualsiasi codice, fai un backup completo. In pratica, la versione gratuita di WPCode copre la maggior parte delle esigenze tipiche: pixel di tracciamento aggiuntivi, microdati, nascondere elementi tramite CSS.

Metodo 2: editor CSS integrato di WordPress

Modifica del codice CSS nel Personalizzatore di WordPress

Verifica che il tema non sovrascriva i tuoi stili: apri il sito in modalità incognito dopo aver aggiunto il CSS.

Se l'intervento è puramente estetico (colore di un pulsante, margine di un widget, dimensione del font nel footer), non ti serve un plugin. WordPress dalla versione 4.7 include un editor CSS aggiuntivo integrato direttamente nel Personalizzatore:

  • Aspetto → Personalizza → CSS aggiuntivo.
  • Incolla la regola CSS nel pannello di sinistra.
  • A destra, un'anteprima dal vivo: vedi le modifiche prima di pubblicarle.

Questo metodo è valido perché il CSS viene salvato nel database insieme alle impostazioni del tema, un aggiornamento del tema non lo cancellerà. Il lato negativo è che l'editor è essenziale, senza evidenziazione della sintassi né controllo degli errori. Per una dozzina di righe di CSS è perfetto, per un centinaio installa un plugin come Simple Custom CSS and JS (oltre 200.000 installazioni), che offre un editor con evidenziazione e permette di collegare il CSS come file esterno per una migliore cache.

Sfumatura importante: il CSS è a cascata dall'alto verso il basso, una regola scritta dopo sovrascrive quella precedente. Ecco perché il CSS del CSS aggiuntivo o di un plugin ha sempre la meglio sugli stili del tema. Se la tua regola non viene applicata, aggiungi !important o rendi il selettore più specifico.

Metodo 3: tema child per modifiche a PHP e template

Esempio di struttura file di un tema child di WordPress

Un tema child eredita tutto dal tema padre, ma permette di sovrascrivere qualsiasi file di template o funzione. È il metodo classico per modificare la logica del sito senza il timore di perdere le modifiche a ogni aggiornamento.

Quando serve un tema child:

  • Quando modifichi il markup delle pagine (header.php, single.php, footer.php).
  • Quando aggiungi codice al functions.php del tema padre: non puoi farlo direttamente perché un aggiornamento sovrascriverebbe il file.
  • Quando sovrascrivi i template di WooCommerce per il tuo negozio.

Creazione in 5 minuti:

Crea una cartella in /wp-content/themes/, ad esempio twentytwentyfive-child. All'interno, due file:

1/*
2 Theme Name: Twenty Twenty-Five Child
3 Template: twentytwentyfive
4*/
5@import url("../twentytwentyfive/style.css");

Il file functions.php:

1<?php
2add_action('wp_enqueue_scripts', function () {
3 wp_enqueue_style(
4 'child-style',
5 get_stylesheet_directory_uri() . '/style.css',
6 ['parent-style'],
7 wp_get_theme()->get('Version')
8 );
9});

Comprimi la cartella in un archivio ZIP, caricalo da Aspetto → Temi → Aggiungi nuovo e attivalo. Per maggiori dettagli, consulta la nostra guida al tema child di WordPress.

L'unico svantaggio di un tema child è che devi studiare la struttura del tema padre per non rompere le dipendenze. Se devi solo modificare i CSS e aggiungere un paio di hook PHP, un plugin per snippet del metodo 1 è sufficiente, non serve un tema child.

Metodo 4: un plugin personale per il codice permanente

Se hai accumulato più di dieci snippet e alcuni sono critici per il funzionamento del sito (custom post type, override di endpoint della REST API, tassonomie personalizzate), raccoglili in un tuo plugin. Non si disattiverà quando cambi tema e non andrà perso con gli aggiornamenti.

Plugin minimale, un solo file PHP:

Crea una cartella my-site-core in /wp-content/plugins/. All'interno, il file my-site-core.php:

1<?php
2/**
3 * Plugin Name: My Site Core
4 * Description: Custom site code: CPT, hooks, shortcodes
5 * Version: 1.0.0
6 * Requires at least: 6.0
7 * Requires PHP: 8.0
8 */

Scrivi tutto il PHP personalizzato sotto questa intestazione. Il plugin apparirà nell'elenco Plugin e potrai attivarlo e disattivarlo come uno qualsiasi.

Per il codice che deve essere sempre eseguito (ad esempio, la registrazione di un custom post type critico per i contenuti), usa i must-use plugin. Crea una cartella /wp-content/mu-plugins/ e inserisci lì un file PHP. I plugin MU vengono eseguiti automaticamente e non hanno un interruttore nel pannello di amministrazione: non puoi disattivarli per errore.

Nota: se inserisci direttamente i file PHP in mu-plugins senza un loader, WordPress non li caricherà dalle sottocartelle. Metti il file nella root di mu-plugins oppure aggiungi un loader, un file PHP di una riga che include i file dalle sottocartelle tramite require_once.

Metodo 5: mostrare codice in un articolo senza eseguirlo

Esempio di visualizzazione del codice HTML nell'editor di WordPress

Un'esigenza diversa non è aggiungere codice al sito, ma mostrarlo ai lettori in un articolo. WordPress di default esegue l'HTML e il PHP inseriti nell'editor visuale, e questo può rompere il layout del post. La soluzione dipende dall'editor che stai usando:

Gutenberg (editor a blocchi): usa il blocco Codice o HTML personalizzato. Il blocco Codice mostra il codice con un font monospaziato in un riquadro, senza eseguirlo. Per l'evidenziazione della sintassi di PHP e CSS, installa il plugin Syntax-highlighting Code Block: colora il codice all'interno del blocco Codice in base al linguaggio.

Classic Editor: nella scheda Visuale, inserire il codice come testo normale funziona per la visualizzazione (ma non dà la formattazione monospaziata). Nella scheda HTML, il codice viene interpretato come reale: WordPress eseguirà i tag e romperà la pagina. Per evitarlo, sostituisci i caratteri attivi con le entità HTML:

Carattere

Sostituzione

<

<

>

>

"

"

&

&amp;

Per un singolo tag, la sostituzione manuale funziona. Per un blocco di 20 righe, usa un encoder online o un plugin. L'elenco completo delle entità carattere è disponibile nella documentazione di WordPress.

⁉️🤔 Domande frequenti

Posso inserire codice PHP direttamente in un articolo WordPress?

No, WordPress non esegue PHP all'interno del contenuto degli articoli per motivi di sicurezza. Se devi eseguire PHP su una pagina specifica, usa uno shortcode registrato nel file functions.php del tema child o in un plugin per snippet. Un'alternativa sono plugin come Insert PHP Code Snippet, che ti permettono di creare uno snippet e inserirlo via shortcode in qualsiasi articolo.

Cosa è più sicuro per un principiante: plugin per snippet o tema child?

Il plugin WPCode o Code Snippets. Isola ogni frammento di codice: un errore in uno snippet non influisce sugli altri, e WordPress intercetta gli errori fatali disattivando automaticamente lo snippet problematico. Un tema child non offre un meccanismo simile, un errore di battitura in functions.php manda in crash l'intero sito. Inoltre, il plugin non è legato al tema: se cambi tema, il codice rimane.

Come posso testare il codice prima di eseguirlo sul sito live?

Crea una copia di staging del sito. La maggior parte degli hosting (SiteGround, Cloudways, Kinsta) offre un pulsante "Crea Staging" nel pannello di controllo. In locale, puoi creare una copia con Local o XAMPP. Fai i test sulla copia, poi trasferisci le modifiche sul sito di produzione. Per modifiche rapide al CSS, apri gli Strumenti per sviluppatori in Chrome (F12), individua l'elemento e applica lo stile direttamente nel browser: è temporaneo e visibile solo a te.

Devo creare un tema child se modifico solo il CSS?

No. Inizia con la funzione CSS aggiuntivo integrata nel Personalizza (Aspetto → Personalizza). È sufficiente per la maggior parte delle modifiche visive, non viene cancellata con l'aggiornamento del tema e non richiede né un plugin né un tema child. Un tema child serve quando devi sovrascrivere file template PHP (header.php, single.php, funzioni del tema).

Quale metodo scegliere per codice critico che non può essere perso?

Plugin must-use (/wp-content/mu-plugins/). Il codice nei plugin MU è sempre in esecuzione, è impossibile disattivarlo dal pannello di amministrazione e sopravvive ai cambi di tema e agli aggiornamenti dei plugin normali. È adatto per registrare custom post type (CPT), tassonomie e override critici delle REST API. Non è adatto per modifiche estetiche, per quelle bastano i CSS aggiuntivi o un plugin per snippet.

Cosa scegliere per la tua attività

Se devi correggere il colore di un pulsante una volta sola, apri Aspetto → Personalizza → CSS aggiuntivo, incolla la regola e dimenticatene. Se stai raccogliendo snippet PHP utili per il sito, installa WPCode: è gratuito, sicuro e non dipende dal tema. Se modifichi i template di pagina o colleghi i tuoi script tramite wp_enqueue_scripts, crea un tema child. E quando gli snippet superano la decina e metà di essi sono critici per il funzionamento del sito, racchiudili in un tuo plugin.

Inizia in piccolo: apri il Personalizza e aggiungi subito la tua prima regola CSS. Scrivi nei commenti quale metodo usi e quale snippet si è rivelato più utile sul tuo sito.