Aggiunta di codice a un'intestazione o a un piè di pagina di WordPress

Per una vasta gamma di motivi, è possibile che a un certo punto vorrai o dovrai aggiungere del codice all'intestazione o al piè di pagina del tuo sito WordPress. Sfortunatamente, la piattaforma non fornisce un modo semplice o diretto per farlo fuori dagli schemi.

La buona notizia è che puoi facilmente rimediare a questo problema con l'aiuto di un tema child e del tuo file functions.php o di un plug-in di WordPress. Qualunque metodo tu scelga, sarai in grado di migliorare facilmente il tuo sito con funzionalità personalizzate, dati utente e strategie di miglioramento delle prestazioni.

In questo post, spiegheremo alcuni casi in cui potresti aver bisogno o voler aggiungere codice all'intestazione e al piè di pagina del tuo sito WordPress. Quindi condivideremo le istruzioni dettagliate per due metodi che ti consentono di modificare questi elementi per creare un'intestazione o un piè di pagina personalizzati. Iniziamo!

Perché modificare il codice dell'intestazione e del piè di pagina di WordPress?

I motivi per cui potresti voler modificare l'intestazione o il piè di pagina di WordPress sono molti e vari. Probabilmente il più ovvio è che a volte vuoi dare uno stile al tuo sito attraverso l'uso di codice personalizzato e hai bisogno di un modo per aggiungere questo codice all'intestazione e/o al piè di pagina.

Tuttavia, queste sono anche posizioni privilegiate per i codici di tracciamento, come quello utilizzato per Google Analytics. Questi codici possono fornire preziose informazioni sul comportamento degli utenti per migliorare le strategie di marketing e di contenuto.

Inoltre, WordPress non include i meta tag per impostazione predefinita. Questi vengono aggiunti all'intestazione del tuo sito per aiutare i motori di ricerca a eseguire la scansione delle tue pagine. Anche se ora non sono così rilevanti come una volta, non c'è nulla di male nell'aggiungerle all'intestazione: possono solo aiutare la visibilità del tuo sito.

Infine, potresti avere familiarità con la pratica di spostare JavaScript che blocca il rendering "below the fold". Questo in genere significa aggiungerlo al footer di WordPress, che richiederà la modifica del suo codice. Questa tecnica può aiutarti a migliorare le prestazioni del tuo sito diminuendo i tempi di caricamento.

Come aggiungere manualmente il codice all'intestazione o al piè di pagina di WordPress (in 2 passaggi)

Esistono due metodi principali per aggiungere codice all'intestazione o al piè di pagina di WordPress. Il primo è modificare manualmente il tema del tuo sito e il secondo è utilizzare un plug-in. Sebbene modificare manualmente i file del tuo tema sia più rischioso e difficile, per alcuni utenti più avanzati è il metodo preferito.

Passaggio 1: crea un tema figlio

L'aggiunta manuale di codice all'intestazione o al piè di pagina di WordPress comporta la modifica di alcuni file del tema. Quando devi farlo, è sempre consigliabile modificare un tema figlio invece di fare scherzi direttamente con i file del tema principale. In questo modo, puoi evitare di perdere le modifiche quando aggiorni il tema.

Fortunatamente, il processo per creare manualmente un tema figlio è piuttosto semplice e puoi accedere ai tutorial di WordPress che ti serviranno per personalizzare le intestazioni. Tuttavia, se hai bisogno di creare un tema figlio in un pizzico, un plug-in per la creazione di temi come Child Theme Configurator può aiutarti.

Con un plug-in per la creazione di temi puoi generare facilmente un tema figlio con il clic di un pulsante, anche se l'approccio completamente manuale potrebbe essere altrettanto rapido una volta che hai il metodo in basso.

Passaggio 2: modifica il file functions.php del tuo tema figlio

Una volta impostato il tema figlio, dovrai accedere e modificare il suo file functions.php . Prima di iniziare, è sempre consigliabile eseguire il backup del sito, nel caso in cui si commettano errori e si desideri ripristinare facilmente uno stato precedente.

Il solito modo per modificare il tuo file functions.php è tramite File Transfer Protocol (FTP) e un client FTP come FileZilla. Tuttavia, puoi anche modificare determinati file dalla dashboard di WordPress. Per accedervi, vai su Aspetto > Editor tema .

Riceverai un avviso che stai per modificare i file del tuo tema: fai clic sul pulsante Capisco per procedere. Successivamente dovrai assicurarti di aver selezionato il file corretto. Nella barra laterale a destra dell'editor del sito, assicurati che Theme Functions (functions.php) sia selezionato.

Ora puoi aggiungere il tuo codice personalizzato alla fine di questo file e fare clic su Aggiorna file quando hai finito.

Come aggiungere codice all'intestazione o al piè di pagina di WordPress con un plug-in (in 2 passaggi)

Sebbene in alcuni casi possa essere più semplice modificare manualmente i file del tema WordPress per aggiungere codice al piè di pagina o alla sezione dell'intestazione, l'utilizzo di un plug-in è solitamente il percorso più sicuro. Ai fini di questo articolo, utilizzeremo uno dei plug-in più popolari e apprezzati per l'attività, intestazione, piè di pagina e post iniezioni.

Tuttavia, ci sono molti plugin disponibili nella directory dei plugin di WordPress e altrove che possono aiutare con questa attività.

Passaggio 1: installa e attiva il tuo plug-in preferito

Per cominciare, dovrai installare e attivare il plug-in che desideri utilizzare. Puoi farlo scaricando il file .zip del plug-in dalla directory dei plug-in o da un altro marketplace online e quindi caricandolo sul tuo sito. In alternativa, vai su Plugin > Aggiungi nuovo nella tua dashboard.

Qui puoi cercare il plug-in piè di pagina o intestazione che desideri utilizzare. Qualunque metodo tu scelga, finirai questo passaggio facendo clic sul pulsante Installa , quindi su Attiva quando viene presentata l'opzione.

Passaggio 2: aggiungi i frammenti di codice all'intestazione, al piè di pagina e alle iniezioni di post

Una volta installato il plug-in, dovresti essere in grado di accedere a Impostazioni> Intestazione e piè di pagina nella dashboard.

Qui troverai un editor di testo per aggiungere frammenti di codice, come un codice di tracciamento di Google Analytics o JavaScript personalizzato, che desideri includere nell'intestazione e/o nel piè di pagina.

C'è molto che puoi realizzare in questa pagina. Nei primi due campi puoi aggiungere il codice alla tua sezione di intestazione. Il campo a sinistra aggiunge il codice a ogni pagina del tuo sito, ad esempio per Google Analytics. Il campo a destra aggiungerà il codice solo alla tua home page.

I campi successivi aggiungono codice al codice del corpo e del piè di pagina delle tue pagine. I campi a sinistra sono per la visualizzazione desktop, mentre quelli a destra sono per le versioni mobili del tuo codice. Una volta terminata la modifica, non dimenticare di fare clic sul pulsante Salva nella parte inferiore dello schermo.

Migliora l'esperienza del tuo sito con WP Engine

Non c'è dubbio che desideri che il tuo sito Web WordPress offra un'esperienza digitale di prim'ordine ai tuoi utenti. L'aggiunta di codice al piè di pagina o all'intestazione di WordPress è una tattica utile per personalizzare il tuo sito, implementare Google Analytics o migliorare le prestazioni.

In WP Engine, disponiamo di un'ampia varietà di risorse per sviluppatori che possono aiutarti a portare l'esperienza del tuo sito Web WordPress a nuovi livelli. Dai un'occhiata oggi!