Anche se WordPress permette di creare e gestire un sito web anche a chi non ha esperienze di codice, probabilmente arriverà un momento in cui vorrete modificare il codice in WordPress per avere un maggiore controllo sul modo il vostro sito appare o funziona.

Per aiutarvi, questo post vi mostrerà come modificare il codice in WordPress in modo sicuro:

Se sapete già cosa volete fare, potete cliccare su uno dei link qui sopra e saltare direttamente alla sezione specifica. Altrimenti, passiamo alle modifiche!

Preferisci guardare la versione video?

Modificare il Codice HTML di WordPress per Singoli Post o Pagine

Cominciamo con il modo più semplice per modificare il codice HTML di WordPress: accedere al codice sorgente per i singoli post, pagine o altri tipi di post di WordPress.

Lo si può fare sia con il nuovo editor di blocchi di WordPress (Gutenberg), sia con il vecchio editor classico TinyMCE.

Come Modificare il Codice HTML di WordPress nell’Editor dei Blocchi (Gutenberg)

Ci sono diversi modi in cui è possibile lavorare con l’HTML in Gutenberg.

In primo luogo, se volete solo aggiungere il vostro codice HTML ad un contenuto, consigliamo di non cercare di modificare l’intero codice sorgente del vostro post, perché questo rende le cose inutilmente complicate.

Al contrario, potete semplicemente usare il blocco HTML personalizzato dedicato e incollare lì dentro il codice HTML che volete usare:

Blocco HTML personalizzato di Gutenberg
Blocco HTML personalizzato di Gutenberg

Tuttavia, potrebbe anche arrivare un momento in cui è necessario modificare direttamente l’HTML di un blocco diverso. Per esempio, se si vuole aggiungere un tag nofollow ad un link nell’editor dei blocchi, sarà necessario modificare l’HTML di quel blocco.

Ci sono due modi per farlo…

In primo luogo, potete cliccare sulle opzioni di un singolo blocco e scegliere l’opzione Modifica come HTML:

Come modificare un singolo blocco come HTML
Come modificare un singolo blocco come HTML

Questo vi permetterà di modificare l’HTML solo per quel singolo blocco:

Esempio di modifica dell'HTML di un blocco
Esempio di modifica dell’HTML di un blocco

Oppure, se si desidera modificare l’HTML per l’intero post, è possibile accedere all’Editor del codice dal menu principale Strumenti e opzioni. Oppure, potete anche usare questa scorciatoia da tastiera per passare dall’editing del codice a quello visivo – Ctrl + Shift + Alt + M:

Come accedere all'editor del codice completo di Gutenberg
Come accedere all’editor del codice completo di Gutenberg

Tenete presente che, nell’editor del codice completo, dovrete lavorare con tutti quei markup dei blocchi – ad esempio <!-- wp:paragraph -->.

Modificare il codice in WordPress non deve essere difficile! Dai un'occhiata a questa semplice guida su come modificare HTML, CSS e PHP. 🤓 Clicca per twittare

Come Modificare il Codice HTML di WordPress nell’Editor Classico (TinyMCE)

Se usate ancora l’editor classico di WordPress (TinyMCE), potete modificare l’HTML dell’intero post andando nella scheda Testo:

Come modificare l'HTML nell'editor classico di WordPress
Come modificare l’HTML nell’editor classico di WordPress

Come Modificare il Codice Sorgente del Tema di WordPress

Ora, passiamo all’argomento principale: come modificare il codice nel tema di WordPress. La posta in gioco è un po’ più alta, quindi abbiamo bisogno di rispondere ad alcune domande preliminari prima di entrare nel merito.

Perché la posta in gioco è più alta? Beh, molto semplicemente, perché, se si rovina qualcosa qui, si può rompere l’intero sito!

Nelle ultime uscite, WordPress ha reso molto più difficile farlo accidentalmente, ma modificare il codice sorgente del sito aprirà sempre la porta ai problemi, quindi dovrete essere sicuri di farlo in modo sicuro.

Usate un Child Theme per Qualsiasi Modifica Diretta del Codice

Se si prevede di modificare direttamente il codice nei file del tema, è necessario utilizzare un child theme invece di modificare il tema “genitore”.

Senza un child theme, qualsiasi modifica del codice sarà sovrascritta la volta successiva che si aggiorna il tema. Quando usate un child theme, tuttavia, sarete in grado di aggiornare prontamente il tema genitore senza perdere le modifiche che avete fatto nel vostro child theme.

Se volete saperne di più sui vantaggi dei child theme e su come crearne uno, consultate la nostra guida completa ai child theme di WordPress.

Considerate la Possibilità di Usare un Plugin Invece di Modificare il Codice nel Child Theme

Se state pensando di modificare il funzionamento del vostro tema, probabilmente dovrete modificare direttamente il codice sorgente del vostro child theme.

Tuttavia, se volete modificare il codice in WordPress per un motivo diverso – come aggiungere uno script di tracciamento alla sezione <head> del vostro sito o un frammento al file functions.php del tema – è meglio utilizzare un plugin.

Ad esempio, iniezioni nell’Head, nel Footer e nel Post permettono di inserire frammenti di codice dove necessario. E dato che questi frammenti di codice sono tutti segregati nell’interfaccia del plugin, è anche più facile gestirli in seguito.

Allo stesso modo, se si aggiunge un frammento di codice che potrebbe andare nel file functions.php del child theme, il plugin gratuito Code Snippets è un’ottima opzione.

In sintesi, se desiderate modificare il codice in WordPress per aggiungere frammenti…

  • nella sezione <head>
  • nel file functions.php

…allora dovreste valutare l’uso di un plugin invece di modificare direttamente i file del vostro tema, in quanto renderà più semplice la gestione di questi frammenti e farà in modo che non vengano sovrascritti quando aggiornate il tema.

Se avete bisogno di fare altre modifiche, cerchiamo di capire come modificare il codice sorgente del tema.

Utilizzate l’Editor di Codice nella Bacheca di WordPress

Se avete intenzione di modificare direttamente il codice del vostro tema, consigliamo vivamente di fare un backup del sito prima di procedere (sia dell’intero sito, che del file che state modificando).

Una volta fatto, potrete accedere all’editor del codice del tema presente nella bacheca andando su Aspetto → Editor del Tema. Qui, WordPress vi darà prima un avvertimento simile a quello che avete imparato sopra:

L'avviso prima di accedere all'editor di codici in-dashboard
L’avviso prima di accedere all’editor di codice della bacheca di WordPress

Poi, potrete usare la barra laterale destra per navigare tra i diversi file del tema e l’editor di codice stesso per effettuare le vostre modifiche:

Lottando con problemi di downtime e WordPress? Kinsta è la soluzione di hosting progettata pensando alle prestazioni e alla sicurezza! Guarda i nostri piani

L'editor di codice della bacheca di WordPress
L’editor di codice della bacheca di WordPress

Utilizzare SFTP per Modificare il Codice in WordPress

In alternativa all’editor di codice in-dashboard, è possibile modificare i file dei temi anche tramite SFTP. Questo approccio presenta due vantaggi:

  • Potete utilizzare il vostro editor di codice preferito.
  • Se accidentalmente si rompe qualcosa, si può risolvere subito il problema. Al contrario, se si modifica il codice tramite il cruscotto di WordPress, c’è sempre la possibilità che si possa rompere qualcosa che vi blocca fuori dal cruscotto di WordPress, il che significa che è necessario collegarsi tramite SFTP per risolvere il problema (anche se, ancora una volta – questo è meno probabile grazie alle recenti modifiche).

Ecco come collegarsi al sito via FTP.

Una volta fatto questo, navigate nella cartella del vostro tema – …/wp-content/themes/child-theme-name. Cercate il file che volete modificare e cliccate con il tasto destro del mouse. La maggior parte dei programmi FTP vi darà la possibilità di modificare il file e lo ricaricherà automaticamente una volta apportate le modifiche.

Tuttavia, raccomandiamo vivamente di scaricare una versione originale del file sul vostro desktop prima di effettuare qualsiasi modifica. In questo modo, è possibile ricaricare la versione originale nel caso in cui si rompa qualcosa accidentalmente:

Come modificare il codice HTML di WordPress tramite SFTP
Come modificare il codice HTML di WordPress tramite SFTP

Aggiungere CSS Personalizzati a WordPress

Se, invece di modificare il codice HTML o PHP, si desidera aggiungere solo CSS personalizzati a WordPress, non è necessario utilizzare l’editor di codice in-dashboard o SFTP.

In questo caso è possibile utilizzare il Customizer di WordPress. Oltre ad essere un’opzione più semplice, un altro vantaggio di questo approccio è la possibilità di visualizzare in anteprima le modifiche in tempo reale.

Per iniziare, andate su Aspetto → Personalizza nella bacheca di WordPress:

Come accedere al Customizer di WordPress
Come accedere al Customizer di WordPress

Quindi, cercate l’opzione CSS aggiuntivo nel Customizer:

Dove trovare l'opzione CSS aggiuntivo nel Customizer di WordPress
Dove trovare l’opzione CSS aggiuntivo nel Customizer di WordPress

Questo aprirà un editor di codice dove potrete aggiungere il vostro CSS. Man mano che aggiungete i CSS, l’anteprima live del vostro sito si aggiornerà automaticamente in base a tali modifiche:

Come modificare i CSS nel Customizer di WordPress
Come modificare i CSS nel Customizer di WordPress

Un’altra buona opzione per aggiungere CSS è il plugin Simple CSS di Tom Usborne. Questo plugin fornisce una soluzione simile al Customizer di WordPress e permette anche di aggiungere CSS personalizzati a singoli post o pagine tramite un meta-box.

Infine, se si desidera aggiungere una tonnellata di CSS personalizzati – come centinaia o migliaia di righe – un’altra opzione è quella di creare il proprio foglio di stile CSS personalizzato e utilizzare wp_enqueue_scripts per aggiungerlo al tema.

Riepilogo

Se si desidera modificare il codice di un singolo post o pagina di WordPress, sia il nuovo editor di blocchi che l’editor classico vi danno la possibilità di modificare direttamente l’HTML.

Se invece volete modificare il codice sorgente del vostro tema WordPress, ci sono alcune cose da considerare:

  • Utilizzare sempre un child theme invece di effettuare modifiche al codice direttamente sul tema genitore.
  • Valutate un plugin per gestire gli snippet che da aggiungere al file functions.php, in quanto questi plugin possono offrire un approccio più semplice e gestibile.

Se dopo queste considerazioni avete ancora bisogno di effettuare modifiche dirette del codice, potete modificare il codice sorgente del vostro child theme dalla bacheca di WordPress andando su Aspetto → Editor dei Temi. Oppure, potete connettervi al sito tramite SFTP e modificare il codice in questo modo.

Infine, se si vuole solo aggiungere qualche CSS personalizzato, non è necessario modificare il codice del tema direttamente. Invece, è possibile utilizzare l’area CSS aggiuntivo nel Customizer di WordPress o un plugin come Simple CSS.

Avete domande su come modificare il codice in WordPress? Chiedete nei commenti!


Risparmia tempo e costi e massimizza le prestazioni del sito con:

  • Aiuto immediato dagli esperti dell’hosting WordPress, 24/7.
  • Integrazione di Cloudflare Enterprise.
  • Copertura globale del pubblico con 35 data center in tutto il mondo.
  • Ottimizzazione del sito con il nostro Monitoraggio delle Prestazioni delle Applicazioni integrato.

Tutto questo e molto altro, in un piano senza contratti a lungo termine, con migrazioni assistite e una garanzia di 30 giorni di rimborso. Scopri i nostri piani o contattaci per trovare il piano che fa per te.