{"id":78510,"date":"2024-08-05T08:22:44","date_gmt":"2024-08-05T07:22:44","guid":{"rendered":"https:\/\/kinsta.com\/it\/?p=78510&#038;preview=true&#038;preview_id=78510"},"modified":"2024-08-05T15:31:34","modified_gmt":"2024-08-05T14:31:34","slug":"theme-json","status":"publish","type":"post","link":"https:\/\/kinsta.com\/it\/blog\/theme-json\/","title":{"rendered":"Sfruttare la potenza di theme.json: personalizzare il tema di WordPress come veri professionisti"},"content":{"rendered":"<p>Oggi, gli sviluppatori di WordPress hanno pi\u00f9 controllo che mai grazie alla continua evoluzione dell&#8217;ecosistema WordPress. Il <a href=\"https:\/\/kinsta.com\/it\/blog\/full-site-editing-wordpress\/\">full site editing (FSE)<\/a> offre a tutti gli utenti la possibilit\u00e0 di costruire un tema da zero, soprattutto utilizzando il file <code>theme.json<\/code>.<\/p>\n<p>Anche gli sviluppatori possono sfruttare il file <code>theme.json<\/code>. Questo file di configurazione consente una personalizzazione granulare del tema WordPress senza la noia e la complessit\u00e0 dei linguaggi di programmazione pi\u00f9 articolati.<\/p>\n<p>In questa guida completa esploreremo le caratteristiche del file <code>theme.json<\/code>, compreso il suo rapporto con il full site editing. Alla fine capirete come sfruttare le sue capacit\u00e0 per creare siti web moderni e performanti, indipendentemente dalle vostre capacit\u00e0 di sviluppo.<br \/>\n<div><\/div><kinsta-auto-toc heading=\"Table of Contents\" exclude=\"last\" list-style=\"arrow\" selector=\"h2\" count-number=\"-1\"><\/kinsta-auto-toc><\/p>\n<h2>Il file theme.json<\/h2>\n<p>Il file <code>theme.json<\/code> \u00e8 un file di configurazione che definisce le impostazioni e gli stili del tema WordPress. Utilizza la JavaScript Object Notation (JSON), ovvero dati strutturati che ereditano le coppie chiave-valore del linguaggio madre per permettervi di scrivere il vostro codice.<\/p>\n<figure id=\"attachment_183346\" aria-describedby=\"caption-attachment-183346\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183346\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/json-code.png\" alt=\"Un frammento di codice JSON che definisce la struttura di un glossario. Include una voce per SGML (Standard Generalized Markup Language) con dettagli quali l'acronimo, l'abbreviazione, la definizione e i termini correlati.\" width=\"1200\" height=\"482\"><figcaption id=\"caption-attachment-183346\" class=\"wp-caption-text\">Esempio di codice JSON.<\/figcaption><\/figure>\n<p>Il file <code>theme.json<\/code> \u00e8 fondamentale per controllare vari aspetti del tema. Tra questi vi sono le palette di colori, le impostazioni tipografiche, le opzioni di layout, gli stili per blocco, le propriet\u00e0 CSS personalizzate e molto altro ancora. Nel corso dell&#8217;articolo forniremo maggiori dettagli su questi aspetti.<\/p>\n<p>Anche se finora non sembra poi cos\u00ec rivoluzionario, <code>theme.json<\/code> \u00e8 importante per il futuro dello sviluppo di WordPress. La prossima sezione spiega perch\u00e9.<\/p>\n<h2>Perch\u00e9 theme.json \u00e8 importante per lo sviluppo dei temi di WordPress<\/h2>\n<p>L&#8217;approccio tipico di WordPress allo <a href=\"https:\/\/kinsta.com\/it\/blog\/tema-react-wordpress\/\">sviluppo di temi<\/a> e alla <a href=\"https:\/\/kinsta.com\/blog\/publish-plugin-wordpress-plugin-directory\/\">creazione di plugin<\/a> si basa spesso sulla <a href=\"https:\/\/kinsta.com\/it\/blog\/template-post-wordpress\/\">modifica dei file di template<\/a> con PHP, sull&#8217;uso del file <a href=\"https:\/\/kinsta.com\/it\/blog\/wordpress-functions-php\/\">functions.php<\/a> e su altre attivit\u00e0 tecniche.<\/p>\n<p>Il file <code>theme.json<\/code> segna un cambiamento significativo, soprattutto per lo sviluppo dei temi. Le ragioni sono molteplici:<\/p>\n<ul>\n<li>Il file rappresenta una posizione unica e organizzata per definire le impostazioni e gli stili del tema. Questo riduce la necessit\u00e0 di avere una serie di file CSS e PHP sparsi.<\/li>\n<li>Questo approccio centralizzato di dichiarazione degli stili e delle impostazioni in <code>theme.json<\/code> significa che WordPress pu\u00f2 generare un CSS pi\u00f9 efficiente. Rispetto all&#8217;utilizzo di un <a href=\"https:\/\/make.wordpress.org\/themes\/2021\/10\/04\/the-performance-impact-of-using-jquery-in-wordpress-themes\/\" target=\"_blank\" rel=\"noopener noreferrer\">framework come jQuery<\/a>, c&#8217;\u00e8 un potenziale miglioramento delle prestazioni.<\/li>\n<li>Si ha un maggiore controllo sullo stile del sito e dei singoli blocchi rispetto al passato. Questo democratizza lo sviluppo dei temi per gli utenti con meno conoscenze tecniche.<\/li>\n<li>Con l&#8217;evoluzione del FSE, il file <code>theme.json<\/code> avr\u00e0 un ruolo fondamentale nel modo in cui i temi, gli stili globali e l&#8217;editor dei blocchi interagiscono tra loro.<\/li>\n<\/ul>\n<p>Combinando tutti questi aspetti si ottiene un modo standardizzato di definire le impostazioni e gli stili per il tema. Per tutti coloro che desiderano comprendere e lavorare con temi diversi, l&#8217;adozione di <code>theme.json<\/code> permetter\u00e0 di creare temi WordPress pi\u00f9 robusti, flessibili e facili da usare. Inoltre, queste creazioni saranno in linea con la direzione futura della piattaforma.<\/p>\n<h2>Dove trovare il file theme.json<\/h2>\n<p>Innanzitutto, non troverete un file <code>theme.json<\/code> nei temi &#8220;tradizionali&#8221; o &#8220;classici&#8221;. Per trovare e utilizzare questo file \u00e8 necessario un tema a blocchi dedicato. Detto questo, \u00e8 possibile creare il file in qualsiasi tema, purch\u00e9 si utilizzi la versione di WordPress 5.8 o una superiore.<\/p>\n<p>La posizione tipica del file <code>theme.json<\/code> \u00e8 all&#8217;interno di <strong>wp-content\/themes\/[your-theme]<\/strong>. Se il file non \u00e8 presente, aprite il vostro editor di codice preferito e create il file come necessario. Per il momento non preoccupatevi dei contenuti: ci penseremo tra poco.<\/p>\n<p><img decoding=\"async\" class=\"size-full wp-image-183342\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/code-editor.png\" alt=\"\"A\"><\/p>\n<p>Se avete bisogno di creare un nuovo file da zero ma volete anche vedere i dettagli del suo contenuto prima di personalizzare il vostro, date un&#8217;occhiata al <a href=\"https:\/\/kinsta.com\/it\/blog\/twenty-twenty-four\/\">tema predefinito Twenty Twenty-Four<\/a>.<\/p>\n<p><img decoding=\"async\" class=\"size-full wp-image-183354\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/twenty-twenty-four-json.png\" alt=\"\"A\"><\/p>\n<p>Essendo un tema a blocchi, avr\u00e0 un file <code>theme.json<\/code> da visualizzare. Pu\u00f2 essere utile averlo aperto mentre analizziamo la struttura nelle prossime sezioni.<\/p>\n<h2>Cosa serve per lavorare con theme.json<\/h2>\n<p>Naturalmente, non tutti saranno in grado di aprire il file di configurazione e mettersi al lavoro. Serviranno comunque alcune competenze e conoscenze fondamentali per costruire e personalizzare un tema:<\/p>\n<ul>\n<li><strong>Conoscenza di base di JSON.<\/strong> Pensiamo che sia qualcosa che si pu\u00f2 imparare velocemente, ma comunque la familiarit\u00e0 con la sintassi e la struttura JSON \u00e8 fondamentale.<\/li>\n<li><strong>Conoscenza dei CSS.<\/strong> Scoprirete che molti oggetti e propriet\u00e0 di <code>theme.json<\/code> corrispondono alle loro controparti CSS. La conoscenza dei CSS sar\u00e0 un vantaggio in questo caso.<\/li>\n<li><strong>Conoscenza dell&#8217;editor di blocchi di WordPress.<\/strong> Capire come funzionano i blocchi e le loro opzioni di personalizzazione vi aiuter\u00e0 nella costruzione.<\/li>\n<\/ul>\n<p>Anche se non \u00e8 strettamente necessario, vi invitiamo a comprendere almeno i concetti chiave dell&#8217;FSE, che vi aiuteranno a sfruttare il file <code>theme.json<\/code> in modo pi\u00f9 efficace. Potrete anche capire come le modifiche influenzeranno il &#8220;tinkering&#8221; dell&#8217;utente finale. Inoltre, in alcuni casi dovrete utilizzare <a href=\"https:\/\/kinsta.com\/it\/blog\/html\/\">HTML<\/a> e <a href=\"https:\/\/kinsta.com\/javascript\/\">JavaScript<\/a> per realizzare la vostra visione.<\/p>\n<p>Infine, vi consigliamo un paio di &#8220;extra&#8221; tecnici:<\/p>\n<ul>\n<li><strong>Un editor di codice.<\/strong> Scegliete un <a href=\"https:\/\/kinsta.com\/it\/blog\/editor-php\/\">editor di qualit\u00e0<\/a> che offra l&#8217;evidenziazione e la validazione della sintassi JSON render\u00e0 pi\u00f9 piacevole il flusso di lavoro.<\/li>\n<li><strong>Un ambiente di sviluppo locale.<\/strong> L&#8217;utilizzo di uno strumento <a href=\"https:\/\/kinsta.com\/it\/devkinsta\/\">come DevKinsta<\/a> per lavorare sul vostro tema vi permetter\u00e0 di sperimentare e testare le modifiche in modo rapido e senza avere alcun impatto sul sito live.<\/li>\n<\/ul>\n<p>Con questi strumenti e queste conoscenze, sarete ben equipaggiati per iniziare a personalizzare il vostro tema WordPress utilizzando <code>theme.json<\/code>.<\/p>\n<h2>L&#8217;anatomia, la struttura e la gerarchia del file theme.json<\/h2>\n<p>Il file <code>theme.json<\/code> ha ovviamente una struttura che \u00e8 necessario comprendere. Ha anche una gerarchia e alcuni elementi unici che necessitano di ulteriori spiegazioni.<\/p>\n<p>Questa \u00e8 probabilmente la parte pi\u00f9 complessa dell&#8217;utilizzo del file di configurazione, ma anche in questo caso i concetti saranno facilmente comprensibili.<\/p>\n<p>Iniziamo con la struttura e poi passiamo agli altri elementi di <code>theme.json<\/code>.<\/p>\n<h3>Struttura di base<\/h3>\n<p>Dato che il file segue il formato JSON, potreste gi\u00e0 intuire il concetto generale della struttura. Innanzitutto, l&#8217;intero oggetto del file \u00e8 racchiuso tra parentesi graffe, cos\u00ec come alcuni dei vari oggetti al suo interno. Ogni oggetto \u00e8 composto da coppie chiave-valore, utilizza apici singoli o doppi per le chiavi e virgole per terminare la riga.<\/p>\n<p>Il minimo indispensabile per un file <code>theme.json<\/code> sono gli oggetti <code>version<\/code>, <code>settings<\/code> e <code>styles<\/code>:<\/p>\n<pre><code class=\"language-json\">{\n    \"version\": 2,\n    \"settings\": {\n      \/\/ Global settings go here\n    },\n    \"styles\": {\n      \/\/ Global styles go here\n    }\n}<\/code><\/pre>\n<p>Gli oggetti <code>settings<\/code> e <code>styles<\/code> sono semplici, ma <code>version<\/code> richiede maggiori spiegazioni. Questo valore sar\u00e0 un numero intero che corrisponde alla versione dell&#8217;API utilizzata per leggere il file. La versione attuale dell&#8217;API \u00e8 <code>3<\/code>, anche se la versione <code>2<\/code> \u00e8 comune e si pu\u00f2 <a href=\"https:\/\/developer.wordpress.org\/block-editor\/reference-guides\/theme-json-reference\/theme-json-migrations\/\" target=\"_blank\" rel=\"noopener noreferrer\">migrare da versioni precedenti<\/a>.<\/p>\n<p>La maggior parte delle strutture dei file <code>theme.json<\/code> <a href=\"https:\/\/schemas.wp.org\/trunk\/theme.json\" target=\"_blank\" rel=\"noopener noreferrer\">include anche uno schema<\/a>. In poche parole, questo permette di lavorare con il completamento automatico negli editor di codice e fornisce la convalida del file. Dovr\u00e0 essere aggiunto all&#8217;inizio del file:<\/p>\n<pre><code class=\"language-json\">{\n    \"$schema\": \"https:\/\/schemas.wp.org\/trunk\/theme.json\",\n    \"version\": 2,\n    \"settings\": {\n    },\n    \"styles\": {\n    }\n}<\/code><\/pre>\n<p>Da qui, aggiungerete varie propriet\u00e0 e oggetti alle <strong>impostazioni<\/strong> e agli <strong>stili<\/strong> per costruire il vostro file.<\/p>\n<h3>Gerarchia<\/h3>\n<p>Il file <code>theme.json<\/code> segue una struttura gerarchica ed \u00e8 solo un livello della gerarchia generale delle <strong>impostazioni<\/strong> e degli <strong>stili<\/strong> del vostro sito. Se avete <a href=\"https:\/\/kinsta.com\/it\/blog\/tecniche-css-avanzate\/\">conoscenze di CSS<\/a>, la comprensione di questo file sar\u00e0 pi\u00f9 semplice, in quanto la sua <a href=\"https:\/\/kinsta.com\/it\/blog\/best-practice-css\/\">complessit\u00e0 \u00e8 simile a quella dei CSS<\/a>.<\/p>\n<p>In breve, le personalizzazioni apportate a <code>theme.json<\/code> potrebbero non essere sempre visibili sul front-end del vostro sito. Le configurazioni degli utenti hanno la priorit\u00e0 su tutto. Ci\u00f2 significa che qualsiasi modifica effettuata nella schermata <strong>Aspetto &gt; Editor<\/strong> di WordPress verr\u00e0 visualizzata sul front-end:<\/p>\n<figure id=\"attachment_183351\" aria-describedby=\"caption-attachment-183351\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183351\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/site-editor-screen.png\" alt=\"L'interfaccia dell'editor del sito WordPress. La barra laterale di sinistra mostra le opzioni di personalizzazione del design, mentre l'area principale mostra il design della homepage del sito web con un titolo sull'innovazione e la sostenibilit\u00e0, insieme all'immagine di una moderna struttura architettonica.\" width=\"1200\" height=\"750\"><figcaption id=\"caption-attachment-183351\" class=\"wp-caption-text\">L&#8217;interfaccia principale dell&#8217;Editor del sito di WordPress.<\/figcaption><\/figure>\n<p>Se utilizzate un <a href=\"https:\/\/kinsta.com\/it\/blog\/child-theme-wordpress\/\">tema child<\/a> e includete un file <code>theme.json<\/code>, questo sovrascriver\u00e0 tutte le modifiche diverse da quelle effettuate con l&#8217;Editor del sito. Allo stesso modo, qualsiasi cosa definiate all&#8217;interno del file di configurazione del tema principale sovrascriver\u00e0 le impostazioni e gli stili predefiniti di WordPress. \u00c8 su questo file che ci concentriamo in questo post, anche se WordPress ha il suo file <code>theme.json<\/code>.<\/p>\n<p>Anche se non sar\u00e0 oggetto di questo post, \u00e8 possibile sovrascrivere i valori utilizzando <a href=\"https:\/\/developer.wordpress.org\/news\/2023\/07\/how-to-modify-theme-json-data-using-server-side-filters\/\" target=\"_blank\" rel=\"noopener noreferrer\">hook e filtri<\/a>. Questi filtri dinamici permettono di creare plugin e temi che modificano anche le impostazioni e gli stili del tema e della piattaforma.<\/p>\n<h3>Grammatica dei blocchi<\/h3>\n<p>Se accedete all&#8217;editor a blocchi o del sito di WordPress, aprite un post o una pagina e attivate l&#8217;editor del codice, noterete molti commenti HTML all&#8217;interno del contenuto:<\/p>\n<figure id=\"attachment_183341\" aria-describedby=\"caption-attachment-183341\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183341\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/code-block-editor.png\" alt=\"L'interfaccia dell'editor di codice di WordPress all'interno dell'editor a blocchi. Mostra il codice HTML per l'informativa sulla privacy di un sito web. Il codice include intestazioni e paragrafi con dettagli sull'indirizzo del sito web, sulle politiche dei commenti e sull'uso di Gravatar.\" width=\"1200\" height=\"750\"><figcaption id=\"caption-attachment-183341\" class=\"wp-caption-text\">La schermata di modifica del codice nell&#8217;Editor dei blocchi di WordPress.<\/figcaption><\/figure>\n<p>Questo perch\u00e9, invece di utilizzare i file PHP, i temi a blocchi utilizzano i file HTML insieme ai commenti e al markup dei blocchi per creare il vostro sito. La combinazione di questi elementi d\u00e0 origine alla &#8220;grammatica dei blocchi&#8221; di cui avete bisogno per scrivere il vostro file <code>theme.json<\/code>.<\/p>\n<p>Per i blocchi che contengono contenuto, come il blocco Paragrafo, il contenuto viene avvolto:<\/p>\n<pre><code class=\"language-html\">&lt;!-- wp:paragraph --&gt;\n    &lt;p&gt;Content goes here!&lt;\/p&gt;\n&lt;!-- \/wp:paragraph --&gt;\n<\/code><\/pre>\n<p>In altri casi, avrete bisogno solo di commenti di una sola riga o di quelli che si chiudono da soli. Con alcuni blocchi, combinerete i tipi per creare i vostri layout e design. Potete anche annidare questi commenti:<\/p>\n<pre><code class=\"language-html\">&lt;!-- wp:columns --&gt;\n&lt;div class=\"wp-block-columns\"&gt;\n    &lt;!-- wp:column --&gt;\n        &lt;div class=\"wp-block-column\"&gt;&lt;\/div&gt;\n    &lt;!-- \/wp:column --&gt;\n    \n\n    &lt;!-- wp:column --&gt;\n        &lt;div class=\"wp-block-column\"&gt;&lt;\/div&gt;\n    &lt;!-- \/wp:column --&gt;\n&lt;\/div&gt;\n&lt;!-- \/wp:columns --&gt;<\/code><\/pre>\n<p>In questo caso, creiamo un blocco Colonne utilizzando un commento wrapper. All&#8217;interno, possiamo iniziare ad aggiungere l&#8217;HTML per progettare le colonne e includere i wrapper delle singole colonne. Questo sarebbe banale sul front-end, dato che spesso si inseriscono i blocchi uno dentro l&#8217;altro.<\/p>\n<p>Per trovare il markup di un particolare blocco, potete sfogliare il <a href=\"https:\/\/developer.wordpress.org\/block-editor\/\" target=\"_blank\" rel=\"noopener noreferrer\">Manuale dell&#8217;editor dei blocchi<\/a> fino a trovare ci\u00f2 che vi serve. Il modo pi\u00f9 semplice, per\u00f2, \u00e8 semplicemente quello di aggiungere il blocco a WordPress, aprire l&#8217;editor del codice e copiare il markup da l\u00ec.<\/p>\n<p>Per quanto riguarda le modifiche da apportare al markup, ne parleremo in una sezione successiva.<\/p>\n<h2>Come si combinano theme.json e la modifica completa del sito WordPress<\/h2>\n<p>Dalla discussione sulla gerarchia, avrete capito che <code>theme.json<\/code> \u00e8 una parte importante di FSE. Entrambi lavorano insieme per offrirvi una soluzione completa di tematizzazione per WordPress. Ad esempio, l&#8217;interfaccia Stili globali \u00e8 essenzialmente la rappresentazione visiva delle impostazioni di <code>theme.json<\/code>.<\/p>\n<figure id=\"attachment_183345\" aria-describedby=\"caption-attachment-183345\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183345\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/global-styles.png\" alt=\"L'editor del sito WordPress, con il lato sinistro che mostra parte del contenuto di un sito web utilizzando un testo di colore rosso scuro. A destra, il pannello Stili si concentra sulle impostazioni dei Colori. Include un selettore di palette di colori e opzioni per personalizzare i colori di vari elementi del sito, come testo, sfondo, link e pulsanti. \u00c8 inoltre visibile un controllore di contrasto che mostra il codice esadecimale #A62B0C per il tema di colore selezionato.\" width=\"1200\" height=\"695\"><figcaption id=\"caption-attachment-183345\" class=\"wp-caption-text\">La barra laterale dell&#8217;editor del sito, che mostra le opzioni degli stili globali di un tema.<\/figcaption><\/figure>\n<p>\u00c8 possibile modificare le impostazioni sia nel pannello Stili globali che nel file di configurazione e WordPress aggiorner\u00e0 i valori corrispondenti quando necessario. Mentre le impostazioni dell&#8217;editor del sito avranno la precedenza, <code>theme.json<\/code> funger\u00e0 da base per gli stili del vostro tema. Per l&#8217;utente finale, gli Stili Globali consentono di sostituire le impostazioni predefinite con le proprie personalizzazioni senza dover utilizzare il codice o modificare il file <code>theme.json<\/code>.<\/p>\n<p>Inoltre, le propriet\u00e0 CSS personalizzate definite in <code>theme.json<\/code> diventano disponibili nell&#8217;interfaccia Stili Globali. In questo modo gli utenti possono sfruttare queste propriet\u00e0 per ottenere uno stile pi\u00f9 coerente in tutto il sito. Questo si estende anche alla possibilit\u00e0 di definire stili e impostazioni specifiche per i blocchi, che possono essere ulteriormente modificati dalla <a href=\"https:\/\/kinsta.com\/it\/blog\/amministrazione-wordpress\/\">bacheca di WordPress<\/a>.<\/p>\n<p>In poche parole, <code>theme.json<\/code> offre un controllo pi\u00f9 granulare su impostazioni, stili e altro ancora. \u00c8 uno strumento a livello di sviluppatore che offre un&#8217;esperienza pi\u00f9 semplice e snella rispetto agli approcci classici. Al contrario, l&#8217;interfaccia Stili globali offre a tutti la possibilit\u00e0 di personalizzare un tema a proprio piacimento. Sviluppando ulteriormente i temi, vedrete come entrambi lavorano in tandem per creare design e layout del sito.<\/p>\n<h2>Lavorare con le propriet\u00e0 del file theme.json<\/h2>\n<p>Una volta comprese le basi, potrete iniziare a lavorare con gli oggetti e le propriet\u00e0 di <code>theme.json<\/code>. Non riusciremo a coprire tutti i casi d&#8217;uso o le eventualit\u00e0. Tuttavia, alla fine di questo tutorial, sarete in grado di creare temi che offrano tutte le funzionalit\u00e0 e che siano belli da vedere.<\/p>\n<h3>Impostazioni<\/h3>\n<p>La propriet\u00e0 <code>settings<\/code> permette di controllare le funzionalit\u00e0 offerte dall&#8217;editor del sito e il loro comportamento. \u00c8 una propriet\u00e0 di primo livello e di solito si trovano pi\u00f9 livelli di annidamento.<\/p>\n<p>Una volta esaminati gli stili e le loro varianti, vedrete che c&#8217;\u00e8 un certo incrocio tra queste opzioni, ma entrambi i tipi hanno un ruolo nella creazione del vostro tema.<\/p>\n<p>Avete a disposizione un numero selezionato di propriet\u00e0:<\/p>\n<pre><code class=\"language-json\">{\n    \"version\": 3,\n    \"settings\": {\n        \"appearanceTools\": false,\n        \"blocks\": {},\n        \"border\": {},\n        \"color\": {},\n        \"custom\": {},\n        \"dimensions\": {},\n        \"layout\": {},\n        \"position\": {},\n        \"shadow\": {},\n        \"spacing\": {},\n        \"typography\": {},\n        \"useRootPaddingAwareAlignments\": false\n    }\n}<\/code><\/pre>\n<p>Il <a href=\"https:\/\/developer.wordpress.org\/themes\/global-settings-and-styles\/settings\/#settings-documentation\" target=\"_blank\" rel=\"noopener noreferrer\">manuale per gli sviluppatori di temi di WordPress<\/a> ufficiale contiene un riferimento per tutte queste impostazioni (e stili). Tuttavia, ecco una rapida panoramica di alcune pi\u00f9 importanti che necessitano di ulteriori chiarimenti:<\/p>\n<ul>\n<li><code>appearanceTools<\/code><strong>.<\/strong> Questa <a href=\"https:\/\/developer.wordpress.org\/themes\/global-settings-and-styles\/settings\/appearance-tools\/\" target=\"_blank\" rel=\"noopener noreferrer\">propriet\u00e0 &#8220;ombrello&#8221;<\/a> ne abilita molte altre ed \u00e8 stata concepita per risparmiare tempo. Imposta le opzioni dei bordi, le altezze delle linee tipografiche, il padding, i margini e molto altro ancora.<\/li>\n<li><code>blocks<\/code><strong>.<\/strong> Mentre la maggior parte del vostro lavoro riguarder\u00e0 le impostazioni e gli stili globali, la propriet\u00e0 <code>blocks<\/code> permette di farlo per ogni blocco. Il concetto non viene trattato in dettaglio in questa sede, ma il <a href=\"https:\/\/developer.wordpress.org\/themes\/global-settings-and-styles\/settings\/blocks\/\" target=\"_blank\" rel=\"noopener noreferrer\">manuale per gli sviluppatori di temi<\/a> contiene un&#8217;eccellente documentazione su questo aspetto di <code>theme.json<\/code>.<\/li>\n<li><code>custom<\/code><strong>.<\/strong> Questa propriet\u00e0 unica non ha alcuna funzionalit\u00e0: siete voi a decidere cosa fare. La utilizzerete per creare <a href=\"https:\/\/developer.wordpress.org\/themes\/global-settings-and-styles\/settings\/custom\/\" target=\"_blank\" rel=\"noopener noreferrer\">propriet\u00e0 CSS personalizzate<\/a> per il vostro tema e il campo di applicazione \u00e8 molto ampio.<\/li>\n<li><code>useRootPaddingAwareAlignments<\/code><strong>.<\/strong> Anche in questo caso si tratta di una propriet\u00e0 complessa che non tratteremo per intero. Vi aiuta essenzialmente a posizionare gli <a href=\"https:\/\/developer.wordpress.org\/themes\/global-settings-and-styles\/settings\/use-root-padding-aware-alignments\/\" target=\"_blank\" rel=\"noopener noreferrer\">stili di padding orizzontale<\/a> del vostro tema ed \u00e8 molto potente. La utilizzerete quando vorrete lasciare che gli elementi a tutta larghezza si estendano fino ai bordi dello schermo utilizzando il padding dell&#8217;elemento principale.<\/li>\n<\/ul>\n<p>\u00c8 bene notare che non \u00e8 necessario aggiungere alcuna propriet\u00e0 a <code>theme.json<\/code> con cui non si vuole lavorare. Ad esempio, se non volete lavorare con <code>appearanceTools<\/code>, potete semplicemente ometterlo piuttosto che definirlo con <code>false<\/code>.<\/p>\n<h4>Come definire le impostazioni nel file theme.json<\/h4>\n<p>Quando si tratta di definire le impostazioni, ogni propriet\u00e0 ha una serie di sottopropriet\u00e0 costituite da coppie chiave-valore. Ad esempio, potete creare <a href=\"https:\/\/developer.wordpress.org\/themes\/global-settings-and-styles\/settings\/color\/\" target=\"_blank\" rel=\"noopener noreferrer\">delle palette di colori<\/a> in questo modo:<\/p>\n<pre><code class=\"language-json\">{\n    \"version\": 3,\n    \"settings\": {\n        \"color\": {\n          \"palette\": [\n            {\n              \"color\": \"#0073aa\",\n              \"name\": \"Primary\",\n              \"slug\": \"primary\"\n            },\n            {\n              \"color\": \"#23282d\",\n              \"name\": \"Secondary\",\n              \"slug\": \"secondary\"\n            }\n          ],\n\u2026<\/code><\/pre>\n<p>Altre propriet\u00e0 hanno semplici valori booleani, che attivano o disattivano le caratteristiche nell&#8217;editor del sito:<\/p>\n<pre><code class=\"language-json\">{\n    \"version\": 3,\n    \"settings\": {\n        \"color\": {\n            \"background\": true,\n            \"defaultPalette\": true,\n            \"link\": true,\n            \"text\": true\n        }\n    }\n}<\/code><\/pre>\n<p>Una volta definite le impostazioni, \u00e8 possibile introdurne lo stile. Esaminiamo ora questo aspetto.<\/p>\n<h3>Stili e variazioni di stile<\/h3>\n<p>Mentre <code>settings<\/code> definisce l&#8217;accesso ad alcune opzioni di stile, la propriet\u00e0 <code>styles<\/code> permette di definire gli stili globali del vostro tema. Anche in questo caso, si tratta di una propriet\u00e0 di primo livello che utilizzer\u00e0 pi\u00f9 livelli di annidamento. Potrete indirizzare elementi specifici, blocchi o persino utilizzare propriet\u00e0 CSS personalizzate.<\/p>\n<p>\u00c8 importante definire gli stili del tema in questo punto in modo da potervi accedere e personalizzarli dall&#8217;editor del sito. Potete lavorare con <a href=\"https:\/\/developer.wordpress.org\/themes\/global-settings-and-styles\/styles\/styles-reference\/\" target=\"_blank\" rel=\"noopener noreferrer\">diversi elementi<\/a>:<\/p>\n<pre><code class=\"language-json\">{\n    \"version\": 3,\n    \"styles\": {\n        \"border\": {},\n        \"color\": {},\n        \"dimensions\": {},\n        \"filter\": {},\n        \"shadow\": {},\n        \"spacing\": {},\n        \"typography\": {},\n        \"css\": {}\n    }\n}<\/code><\/pre>\n<p>Tuttavia, spesso non utilizzerete molti di questi come propriet\u00e0 di secondo livello. Invece, alcune funzionano principalmente con i blocchi o gli elementi. Ad esempio:<\/p>\n<pre><code class=\"language-json\">\u2026\n\"styles\": {\n    \"blocks\": {\n        \"core\/group\": {\n            \"color\": {\n                \"text\": \"#000000\",\n                \"background\": \"#ffffff\",\n                \"link\": \"#777777\"\n            }\n\u2026<\/code><\/pre>\n<p>Per gli stili globali, lavorerete sulla root, che corrisponde al tag <code>&lt;body&gt;<\/code> della pagina. Per gli elementi specifici, potete seguire una struttura simile a quella dei blocchi, questa volta utilizzando la propriet\u00e0 <code>elements<\/code>:<\/p>\n<pre><code class=\"language-json\">\u2026\n\"styles\": {\n    \"elements\": {\n        \"button\": {\n            \"color\": {\n                \"text\": \"#ffffff\",\n                \"background\": \"#aa3f33\"\n            }\n\u2026<\/code><\/pre>\n<p>Se osservate le modifiche apportate nell&#8217;Editor del sito, dovreste vederle al loro posto. Il markup generer\u00e0 anche il CSS per gli stili creati:<\/p>\n<figure id=\"attachment_183344\" aria-describedby=\"caption-attachment-183344\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183344\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/generate-css.png\" alt=\"La homepage di un sito web con il titolo \"Un impegno per l'innovazione e la sostenibilit\u00e0\" e un pulsante Chi siamo. La met\u00e0 inferiore mostra la struttura HTML del sito nel pannello DevTools del browser Brave.\" width=\"1200\" height=\"720\"><figcaption id=\"caption-attachment-183344\" class=\"wp-caption-text\">Il front-end di un sito che mostra il browser DevTools, evidenziando il CSS generato per un elemento.<\/figcaption><\/figure>\n<p>Notate che \u00e8 possibile anche creare pseudo-classi di stile per gli elementi, come gli stili hover e focus:<\/p>\n<pre><code class=\"language-json\">\u2026\n\"elements\": {\n    \"button\": {\n        \"color\": {\n            \"text\": \"#ffffff\",\n            \"background\": \"#aa3f33\"\n        },\n        \":hover\": {\n            \"color\": {\n                \"background\": \"#822f27\"\n            }\n\u2026<\/code><\/pre>\n<p>L&#8217;<a href=\"https:\/\/developer.wordpress.org\/themes\/global-settings-and-styles\/styles\/applying-styles\/\" target=\"_blank\" rel=\"noopener noreferrer\">applicazione degli stili<\/a> \u00e8 ancora pi\u00f9 approfondita di cos\u00ec, e questo \u00e8 uno dei fantastici vantaggi dell&#8217;utilizzo di <code>theme.json<\/code>.<\/p>\n<h4>Variazioni di stile<\/h4>\n<p>Prima di andare avanti, \u00e8 necessario conoscere le variazioni di stile. Potete vedere le varie palette di colori e gli stili tipografici all&#8217;interno dell&#8217;interfaccia del FSE:<\/p>\n<figure id=\"attachment_183352\" aria-describedby=\"caption-attachment-183352\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183352\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/style-variations-fse.png\" alt=\"L'interfaccia dell'editor del sito WordPress mostra le varianti di stile di un tema sul lato sinistro, con varie opzioni di carattere e colore. L'area del contenuto principale mostra un'intestazione \"Un impegno per l'innovazione e la sostenibilit\u00e0\" con un sottotitolo, il pulsante Chi siamo e l'immagine principale di un edificio moderno.\" width=\"1200\" height=\"571\"><figcaption id=\"caption-attachment-183352\" class=\"wp-caption-text\">La barra laterale degli stili all&#8217;interno dell&#8217;Editor del sito, che mostra diverse varianti.<\/figcaption><\/figure>\n<p>Tuttavia, non si tratta di un codice da inserire in <code>theme.json<\/code>. Al contrario, dovrete creare versioni alternative del file, assegnare loro un nome univoco e memorizzarle nella directory degli <strong>stili<\/strong> del tema:<\/p>\n<figure id=\"attachment_183355\" aria-describedby=\"caption-attachment-183355\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183355\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/variations-code.png\" alt=\"L'interfaccia di macOS mostra due finestre. La finestra di sfondo mostra un esploratore di file con pi\u00f9 file JSON per diversi schemi di colore. La finestra in primo piano mostra un editor di codice aperto su green.json, che contiene le impostazioni dei colori del tema per uno schema di colori verde.\" width=\"1200\" height=\"822\"><figcaption id=\"caption-attachment-183355\" class=\"wp-caption-text\">Un editor di codice che mostra i file JSON delle variazioni di stile.<\/figcaption><\/figure>\n<p>Notate che il titolo all&#8217;interno del markup \u00e8 unico per ogni file JSON alternativo. Tuttavia, si tratta di un campo facoltativo, anche se vi consigliamo di utilizzarlo per ottenere una maggiore chiarezza e una migliore esperienza.<\/p>\n<h3>Template personalizzati e parti di template<\/h3>\n<p>Come per le variazioni di stile, <code>theme.json<\/code> permette di registrare template personalizzati e parti di template associate. La registrazione del markup \u00e8 semplice:<\/p>\n<pre><code class=\"language-json\">\"customTemplates\": [\n    {\n        \"name\": \"my-template\",\n        \"title\": \"My Template\",\n        \"postTypes\": [\n            \"page\",\n            \"post\"\n        ]\n    }\n]<\/code><\/pre>\n<p>La propriet\u00e0 <code>customTemplates<\/code> richiede la definizione di tre elementi:<\/p>\n<ul>\n<li><code>name<\/code><strong>.<\/strong> Corrisponde a un template creato all&#8217;interno della cartella <strong>template<\/strong> del vostro tema, come ad esempio <strong>\/template\/my-template.html<\/strong>.<\/li>\n<li><code>title<\/code><strong>.<\/strong> Questa \u00e8 la versione leggibile del nome del template.<\/li>\n<li><code>postTypes<\/code><strong>.<\/strong> Senza una definizione, il template corrisponde di default a una pagina, ma potete specificare una serie di tipi di post per i quali il template \u00e8 adatto.<\/li>\n<\/ul>\n<p>Gli utenti potranno selezionare i template registrati dall&#8217;editor del sito o del blocco:<\/p>\n<figure id=\"attachment_183353\" aria-describedby=\"caption-attachment-183353\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183353\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/template-site-editor.png\" alt=\"L'editor di blocchi di WordPress mostra i dettagli di una pagina pubblicata, tra cui lo stato, la data di pubblicazione, il link, l'autore e il template. \u00c8 presente un menu a discesa con le opzioni per modificare, scambiare, mostrare o creare un nuovo template.\" width=\"1200\" height=\"576\"><figcaption id=\"caption-attachment-183353\" class=\"wp-caption-text\">Scegliere di modificare, scambiare, creare o mostrare un template all&#8217;interno dell&#8217;Editor del sito WordPress.<\/figcaption><\/figure>\n<p>Per quanto riguarda le parti del template, non \u00e8 necessario registrarle, ma lo consigliamo. La struttura \u00e8 simile a quella della registrazione dei template:<\/p>\n<pre><code class=\"language-json\">\u2026\n\"templateParts\": [\n    {\n        \"area\": \"header\",\n        \"name\": \"header\",\n        \"title\": \"Header\"\n    },\n\u2026<\/code><\/pre>\n<p>In questo caso, il nome e il titolo corrispondono alle stesse definizioni dei template completi. L&#8217;area si riferisce all&#8217;area di appartenenza della parte: le aree <code>header<\/code>, <code>footer<\/code> o <code>uncategorized<\/code> sono quelle predefinite, ma potete assegnare le parti template a qualsiasi area personalizzata.<\/p>\n<p>Vi invitiamo a studiare anche il modo in cui <a href=\"https:\/\/developer.wordpress.org\/themes\/global-settings-and-styles\/template-parts\/#including-a-template-part\" target=\"_blank\" rel=\"noopener noreferrer\">visualizzare queste parti di template<\/a>, poich\u00e9 non si vedranno senza un po&#8217; di codice aggiuntivo. Anche in questo caso, la loro registrazione \u00e8 semplice.<\/p>\n<h3>Pattern<\/h3>\n<p>Per concludere, parliamo dei block pattern. Potete raggruppare un numero qualsiasi di questi pattern all&#8217;interno del vostro file <code>theme.json<\/code> utilizzando un array di primo livello. Qualsiasi pattern adatto dalla <a href=\"https:\/\/wordpress.org\/patterns\/\" target=\"_blank\" rel=\"noopener noreferrer\">libreria dei pattern di WordPress<\/a> \u00e8 disponibile per essere incluso nel vostro file:<\/p>\n<figure id=\"attachment_183348\" aria-describedby=\"caption-attachment-183348\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183348\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/pattern-library-wordpress.png\" alt=\"La schermata di ricerca della libreria di pattern di WordPress mostra una griglia di template per la progettazione di siti web. I template includono vari design di banner e intestazioni con immagini, testo e pulsanti.\" width=\"1200\" height=\"750\"><figcaption id=\"caption-attachment-183348\" class=\"wp-caption-text\">La libreria dei pattern di WordPress.<\/figcaption><\/figure>\n<p>Definire l&#8217;array \u00e8 semplice; basta utilizzare la propriet\u00e0 <code>patterns<\/code> e lo slug del pattern associato dall&#8217;URL della libreria:<\/p>\n<figure id=\"attachment_183349\" aria-describedby=\"caption-attachment-183349\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183349\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/pattern-slug.png\" alt=\"Un primo piano della barra degli indirizzi di un browser che evidenzia lo slug dell'URL nella barra degli strumenti. Il resto della schermata mostra un pattern di immagini eroe arancione, con un titolo grande, una descrizione piccola e un pulsante Acquista ora.\" width=\"1200\" height=\"750\"><figcaption id=\"caption-attachment-183349\" class=\"wp-caption-text\">Selezione dello slug di un pattern dall&#8217;URL di un browser web.<\/figcaption><\/figure>\n<p>Grazie a questo slug, potete inserire il markup di <code>patterns<\/code>:<\/p>\n<pre><code class=\"language-json\">{\n    \"version\": 3,\n    \"patterns\": [\n        \"fullwidth-vertically-aligned-headline-on-right-with-description-on-left\"\n    ]\n}<\/code><\/pre>\n<p>Potrete selezionarli dalla directory dei pattern dell&#8217;editor a blocchi:<\/p>\n<figure id=\"attachment_183347\" aria-describedby=\"caption-attachment-183347\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183347\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/pattern-directory.png\" alt=\"L'interfaccia dell'editor a blocchi di WordPress mostra un menu laterale di elementi e pattern di blocco sulla sinistra e un'anteprima di vari design di banner sulla destra. Il banner principale visualizzato presenta il testo in grassetto LET 'EM ROLL BIG JOHN PATTON su uno sfondo arancione.\" width=\"1200\" height=\"750\"><figcaption id=\"caption-attachment-183347\" class=\"wp-caption-text\">La directory dei patter di WordPress all&#8217;interno dell&#8217;Editor a blocchi.<\/figcaption><\/figure>\n<p>Questo semplice modo di inserire le risorse della libreria dei pattern nei vostri temi \u00e8 comodo e prezioso. \u00c8 un altro motivo per cui il file <code>theme.json<\/code> sta rapidamente diventando il modo preferito di costruire tra gli sviluppatori di temi WordPress.<\/p>\n<h2>Il flusso di lavoro per personalizzare un sito WordPress utilizzando theme.json<\/h2>\n<p>Una volta compresi i componenti chiave di <code>theme.json<\/code>, lo sviluppo del flusso di lavoro per il suo utilizzo \u00e8 un passo importante. Rappresenta un nuovo modo di sviluppare i temi e come tale deve essere gestito in modo diverso rispetto ai metodi classici.<\/p>\n<p>Il nostro approccio prevede la configurazione dell&#8217;URL dello schema, la scelta della versione dell&#8217;API e la definizione delle impostazioni globali. Queste includono la tavolozza dei colori, le opzioni tipografiche e le impostazioni del layout. Nella maggior parte dei casi, anche l&#8217;attivazione di <code>appearanceTools<\/code> sarebbe utile:<\/p>\n<pre><code class=\"language-json\">\"$schema\": \"https:\/\/schemas.wp.org\/trunk\/theme.json\",\n\"version\": 3,\n   \"settings\": {\n\"appearanceTools\": true,\n     \"color\": {\n       \"palette\": [\n         {\n           \"name\": \"Primary\",\n\"slug\": \"primary\",\n           \"color\": \"#0073aa\"\n         },\n         {\n      \"name\": \"Secondary\",\n        \"slug\": \"secondary\",\n           \"color\": \"#23282d\"\n         }\n       ]\n     },\n     \"typography\": {\n\"fluid\": true,\n       \"fontSizes\": [\n         {\n           \"size\": \"13px\",\n           \"slug\": \"small\",\n           \"name\": \"Small\"\n         },\n         {\n\"size\": \"16px\",\n           \"slug\": \"normal\",\n           \"name\": \"Normal\"\n\u2026<\/code><\/pre>\n<p>Successivamente, potete cercare di creare propriet\u00e0 CSS personalizzate utilizzando gli slug che avete definito. Ad esempio, potreste aver creato dei pesi dei caratteri personalizzati:<\/p>\n<pre><code class=\"language-json\">\u2026\n\"custom\": {\n    \"fontWeight\": {\n        \"light\": 300,\n        \"regular\": 400,\n        \"medium\": 500,\n        \"bold\": 700\n    },\n\u2026<\/code><\/pre>\n<p>Una volta terminate le impostazioni, \u00e8 il momento di specificare gli stili.<\/p>\n<pre><code class=\"language-json\">\u2026\n\"styles\": {\n    \"color\": {\n        \"background\": \"var(--wp--preset--color--base)\",\n        \"text\": \"var(--wp--preset--color--main)\"\n    },\n\u2026<\/code><\/pre>\n<p>La personalizzazione degli stili dei blocchi \u00e8 il prossimo passo e potrebbe rappresentare una parte importante del vostro file <code>theme.json<\/code>.<\/p>\n<pre><code class=\"language-json\">\u2026\n\"styles\": {\n    \"block\": {\n        \"core\/separator\": {\n            \"color\": {\n            \"text\": \"var(--wp--preset--color--main)\"\n            },\n        \"typography\": {\n            \"fontSize\": \"var(--wp--preset--font-size--large)\"\n            }\n        },\n        \"core\/site-tagline\": {\n            \"spacing\": {\n                \"margin\": {\n                    \"bottom\": \"20px\"\n                }\n            },\n            \"typography\": {\n                \"fontSize\": \"var(--wp--preset--font-size--small)\"\n            }\n        },\n        \"core\/site-title\": {\n            \"typography\": {\n                \"fontSize\": \"var(--wp--preset--font-size--medium)\",\n                \"fontWeight\": \"var(--wp--custom--font-weight--semi-bold)\",\n                \"lineHeight\": \"var(--wp--custom--line-height--none)\"\n        },\n\u2026<\/code><\/pre>\n<p>Infine, dovrete progettare tutti i template e le parti di template personalizzati e registrarli all&#8217;interno di <code>theme.json<\/code>. Questo \u00e8 anche il momento di registrare tutti i pattern di blocco che volete utilizzare e crearli se necessario.<\/p>\n<h3>Utilizzare Kinsta come parte del flusso di lavoro per lo sviluppo e la personalizzazione dei temi<\/h3>\n<p>Prima di apportare qualsiasi modifica, dovrete testare tutto. Finora avrete probabilmente lavorato con uno strumento di sviluppo locale come <a href=\"https:\/\/kinsta.com\/it\/devkinsta\/\">DevKinsta<\/a>:<\/p>\n<figure id=\"attachment_183343\" aria-describedby=\"caption-attachment-183343\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183343\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/devkinsta.png\" alt=\"L'interfaccia di DevKinsta per un singolo sito. Mostra dettagli come la versione di WordPress, il server web, la versione PHP e il tipo di database, oltre a un'anteprima della homepage del sito.\" width=\"1200\" height=\"592\"><figcaption id=\"caption-attachment-183343\" class=\"wp-caption-text\">L&#8217;interfaccia di DevKinsta.<\/figcaption><\/figure>\n<p>Tuttavia, \u00e8 anche importante testare i risultati delle attivit\u00e0 di sviluppo su un sito live. L&#8217;<a href=\"https:\/\/kinsta.com\/it\/docs\/devkinsta\/devkinsta-integrazione\/#push-changes-to-staging\">integrazione con Kinsta<\/a> di DevKinsta permette di inviare un sito a un <a href=\"https:\/\/kinsta.com\/it\/hosting-wordpress\/staging\/\">ambiente di staging<\/a> standard o premium:<\/p>\n<figure id=\"attachment_183350\" aria-describedby=\"caption-attachment-183350\" style=\"width: 1200px\" class=\"wp-caption aligncenter\"><img loading=\"lazy\" decoding=\"async\" class=\"size-full wp-image-183350\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/07\/push-to-kinsta.png\" alt=\"L'interfaccia di DevKinsta mostra le informazioni e i controlli del sito. Il menu a discesa del pulsante Sync \u00e8 aperto e mostra le opzioni Push to Kinsta e Pull from Kinsta.\" width=\"1200\" height=\"417\"><figcaption id=\"caption-attachment-183350\" class=\"wp-caption-text\">Le opzioni di sincronizzazione in DevKinsta.<\/figcaption><\/figure>\n<p>Da qui potrete testare il vostro tema sulla nostra architettura cloud di prim&#8217;ordine e avere il pieno controllo sulle modifiche che apporterete.<\/p>\n<p>Potete anche sfruttare la nostra soluzione completa di gestione dei backup, che permette di ripristinare i backup automatici giornalieri sia negli ambienti live che in quelli di staging. Inoltre, tutti i nostri ambienti di staging sono dotati di DevTools per aiutarvi a monitorare le prestazioni del vostro sito prima di eseguirne il push a live.<\/p>\n<h2>Meglio usare theme.json o il full site editing con WordPress?<\/h2>\n<p>Dato che <code>theme.json<\/code> e il full site editing si sovrappongono, potreste chiedervi perch\u00e9 usare l&#8217;uno piuttosto che l&#8217;altro. In realt\u00e0, entrambi si adattano a scenari diversi e dovrebbero essere utilizzati insieme.<\/p>\n<p>Ad esempio, <code>theme.json<\/code> sar\u00e0 il vostro strumento preferito nelle seguenti situazioni:<\/p>\n<ul>\n<li>Sviluppate temi e create un nuovo tema da zero.<\/li>\n<li>JSON \u00e8 un linguaggio che conoscete e con cui vi trovate bene a lavorare.<\/li>\n<li>Volete un metodo programmatico per definire stili e impostazioni predefinite per il vostro tema.<\/li>\n<li>Gli stili e le impostazioni che volete implementare necessitano di un controllo maggiore rispetto a quello che potete trovare di default nell&#8217;editor del sito.<\/li>\n<\/ul>\n<p>Certo, quest&#8217;ultimo punto sar\u00e0 di nicchia, poich\u00e9 il FSE rispecchia quasi esattamente le funzionalit\u00e0 di <code>theme.json<\/code>. Pertanto, il full site editing avr\u00e0 pi\u00f9 senso per la maggior parte degli utenti nei seguenti scenari:<\/p>\n<ul>\n<li>Siete i proprietari di un sito che vuole <a href=\"https:\/\/kinsta.com\/it\/blog\/come-personalizzare-il-vostro-tema-wordpress\/\">personalizzare un tema esistente<\/a>.<\/li>\n<li>Non avete familiarit\u00e0 con JSON.<\/li>\n<li>Le interfacce visive hanno pi\u00f9 senso per il vostro flusso di lavoro di personalizzazione e sviluppo.<\/li>\n<li>Volete apportare modifiche rapide senza dover ricorrere a una codifica approfondita.<\/li>\n<\/ul>\n<p>In pratica, il tema avr\u00e0 bisogno di un file di configurazione per definire le sue basi. Da l\u00ec, la gerarchia prende il sopravvento e i proprietari del sito possono utilizzare il FSE per apportare ulteriori personalizzazioni.<\/p>\n<h2>Riepilogo<\/h2>\n<p>Il file di configurazione <code>theme.json<\/code> \u00e8 rivoluzionario per lo sviluppo di temi WordPress. Offre una sede centralizzata per le impostazioni e gli stili del tema e permette di creare temi pi\u00f9 flessibili, manutenibili e personalizzabili.<\/p>\n<p>Utilizzerete il file insieme all&#8217;editor del sito di WordPress per arrivare al design finale di un sito. Le opzioni impostate all&#8217;interno di <code>theme.json<\/code> sono quelle predefinite, che l&#8217;utente finale potr\u00e0 personalizzare ulteriormente. La buona notizia \u00e8 che la codifica di questo file \u00e8 pi\u00f9 semplice rispetto alla modifica di una serie di file PHP e CSS.<\/p>\n<p>Avete qualche domanda sull&#8217;utilizzo del file <code>theme.json<\/code> in WordPress? Fatecelo sapere nella sezione commenti qui sotto!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Oggi, gli sviluppatori di WordPress hanno pi\u00f9 controllo che mai grazie alla continua evoluzione dell&#8217;ecosistema WordPress. Il full site editing (FSE) offre a tutti gli utenti &#8230;<\/p>\n","protected":false},"author":199,"featured_media":78511,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[],"topic":[25878,25873],"class_list":["post-78510","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","topic-design-sito-wordpress","topic-sviluppo-wordpress"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Sfrutta la potenza di theme.json - Kinsta\u00ae<\/title>\n<meta name=\"description\" content=\"Lo sviluppo di temi WordPress oggi si basa sul file theme.json. Analizziamo tutto ci\u00f2 che riguarda questo importante file di configurazione!\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinsta.com\/it\/blog\/theme-json\/\" \/>\n<meta property=\"og:locale\" content=\"it_IT\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Sfruttare la potenza di theme.json: personalizzare il tema di WordPress come veri professionisti\" \/>\n<meta property=\"og:description\" content=\"Lo sviluppo di temi WordPress oggi si basa sul file theme.json. Analizziamo tutto ci\u00f2 che riguarda questo importante file di configurazione!\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/it\/blog\/theme-json\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/kinstaitalia\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-08-05T07:22:44+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-08-05T14:31:34+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson.jpg\" \/>\n\t<meta property=\"og:image:width\" content=\"1461\" \/>\n\t<meta property=\"og:image:height\" content=\"730\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/jpeg\" \/>\n<meta name=\"author\" content=\"Jeremy Holcombe\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"Lo sviluppo di temi WordPress oggi si basa sul file theme.json. Analizziamo tutto ci\u00f2 che riguarda questo importante file di configurazione!\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson-1024x512.jpg\" \/>\n<meta name=\"twitter:creator\" content=\"@Kinsta_IT\" \/>\n<meta name=\"twitter:site\" content=\"@Kinsta_IT\" \/>\n<meta name=\"twitter:label1\" content=\"Scritto da\" \/>\n\t<meta name=\"twitter:data1\" content=\"Jeremy Holcombe\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tempo di lettura stimato\" \/>\n\t<meta name=\"twitter:data2\" content=\"25 minuti\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/it\/blog\/theme-json\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/it\/blog\/theme-json\/\"},\"author\":{\"name\":\"Jeremy Holcombe\",\"@id\":\"https:\/\/kinsta.com\/it\/#\/schema\/person\/4eee42881d7b5a73ebb4f58dd5223b21\"},\"headline\":\"Sfruttare la potenza di theme.json: personalizzare il tema di WordPress come veri professionisti\",\"datePublished\":\"2024-08-05T07:22:44+00:00\",\"dateModified\":\"2024-08-05T14:31:34+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/it\/blog\/theme-json\/\"},\"wordCount\":3698,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/it\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/it\/blog\/theme-json\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson.jpg\",\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/it\/blog\/theme-json\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/it\/blog\/theme-json\/\",\"url\":\"https:\/\/kinsta.com\/it\/blog\/theme-json\/\",\"name\":\"Sfrutta la potenza di theme.json - Kinsta\u00ae\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/it\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/it\/blog\/theme-json\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/it\/blog\/theme-json\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson.jpg\",\"datePublished\":\"2024-08-05T07:22:44+00:00\",\"dateModified\":\"2024-08-05T14:31:34+00:00\",\"description\":\"Lo sviluppo di temi WordPress oggi si basa sul file theme.json. Analizziamo tutto ci\u00f2 che riguarda questo importante file di configurazione!\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/it\/blog\/theme-json\/#breadcrumb\"},\"inLanguage\":\"it-IT\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/it\/blog\/theme-json\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\/\/kinsta.com\/it\/blog\/theme-json\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson.jpg\",\"contentUrl\":\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson.jpg\",\"width\":1461,\"height\":730},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/it\/blog\/theme-json\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/it\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Design del Sito WordPress\",\"item\":\"https:\/\/kinsta.com\/it\/argomenti\/design-sito-wordpress\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Sfruttare la potenza di theme.json: personalizzare il tema di WordPress come veri professionisti\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/it\/#website\",\"url\":\"https:\/\/kinsta.com\/it\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Soluzioni di hosting premium, veloci e sicure\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/it\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/it\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"it-IT\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/it\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/it\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\/\/kinsta.com\/it\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/it\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/kinstaitalia\/\",\"https:\/\/x.com\/Kinsta_IT\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinsta.com\/it\/#\/schema\/person\/4eee42881d7b5a73ebb4f58dd5223b21\",\"name\":\"Jeremy Holcombe\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"it-IT\",\"@id\":\"https:\/\/kinsta.com\/it\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/0e17001f3bb37dbbe54fceef9bb547fa?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/0e17001f3bb37dbbe54fceef9bb547fa?s=96&d=mm&r=g\",\"caption\":\"Jeremy Holcombe\"},\"description\":\"Senior Editor at Kinsta, WordPress Web Developer, and Content Writer. Outside of all things WordPress, I enjoy the beach, golf, and movies. I also have tall people problems.\",\"sameAs\":[\"https:\/\/www.linkedin.com\/in\/jeremyholcombe\/\"],\"url\":\"https:\/\/kinsta.com\/it\/blog\/author\/jeremyholcombe\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Sfrutta la potenza di theme.json - Kinsta\u00ae","description":"Lo sviluppo di temi WordPress oggi si basa sul file theme.json. Analizziamo tutto ci\u00f2 che riguarda questo importante file di configurazione!","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kinsta.com\/it\/blog\/theme-json\/","og_locale":"it_IT","og_type":"article","og_title":"Sfruttare la potenza di theme.json: personalizzare il tema di WordPress come veri professionisti","og_description":"Lo sviluppo di temi WordPress oggi si basa sul file theme.json. Analizziamo tutto ci\u00f2 che riguarda questo importante file di configurazione!","og_url":"https:\/\/kinsta.com\/it\/blog\/theme-json\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/kinstaitalia\/","article_published_time":"2024-08-05T07:22:44+00:00","article_modified_time":"2024-08-05T14:31:34+00:00","og_image":[{"width":1461,"height":730,"url":"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson.jpg","type":"image\/jpeg"}],"author":"Jeremy Holcombe","twitter_card":"summary_large_image","twitter_description":"Lo sviluppo di temi WordPress oggi si basa sul file theme.json. Analizziamo tutto ci\u00f2 che riguarda questo importante file di configurazione!","twitter_image":"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson-1024x512.jpg","twitter_creator":"@Kinsta_IT","twitter_site":"@Kinsta_IT","twitter_misc":{"Scritto da":"Jeremy Holcombe","Tempo di lettura stimato":"25 minuti"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/it\/blog\/theme-json\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/it\/blog\/theme-json\/"},"author":{"name":"Jeremy Holcombe","@id":"https:\/\/kinsta.com\/it\/#\/schema\/person\/4eee42881d7b5a73ebb4f58dd5223b21"},"headline":"Sfruttare la potenza di theme.json: personalizzare il tema di WordPress come veri professionisti","datePublished":"2024-08-05T07:22:44+00:00","dateModified":"2024-08-05T14:31:34+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/it\/blog\/theme-json\/"},"wordCount":3698,"commentCount":0,"publisher":{"@id":"https:\/\/kinsta.com\/it\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/it\/blog\/theme-json\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson.jpg","inLanguage":"it-IT","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/it\/blog\/theme-json\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/it\/blog\/theme-json\/","url":"https:\/\/kinsta.com\/it\/blog\/theme-json\/","name":"Sfrutta la potenza di theme.json - Kinsta\u00ae","isPartOf":{"@id":"https:\/\/kinsta.com\/it\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/it\/blog\/theme-json\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/it\/blog\/theme-json\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson.jpg","datePublished":"2024-08-05T07:22:44+00:00","dateModified":"2024-08-05T14:31:34+00:00","description":"Lo sviluppo di temi WordPress oggi si basa sul file theme.json. Analizziamo tutto ci\u00f2 che riguarda questo importante file di configurazione!","breadcrumb":{"@id":"https:\/\/kinsta.com\/it\/blog\/theme-json\/#breadcrumb"},"inLanguage":"it-IT","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/it\/blog\/theme-json\/"]}]},{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/kinsta.com\/it\/blog\/theme-json\/#primaryimage","url":"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson.jpg","contentUrl":"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2024\/08\/unleashing-the-power-of-themejson.jpg","width":1461,"height":730},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/it\/blog\/theme-json\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/it\/"},{"@type":"ListItem","position":2,"name":"Design del Sito WordPress","item":"https:\/\/kinsta.com\/it\/argomenti\/design-sito-wordpress\/"},{"@type":"ListItem","position":3,"name":"Sfruttare la potenza di theme.json: personalizzare il tema di WordPress come veri professionisti"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/it\/#website","url":"https:\/\/kinsta.com\/it\/","name":"Kinsta\u00ae","description":"Soluzioni di hosting premium, veloci e sicure","publisher":{"@id":"https:\/\/kinsta.com\/it\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/it\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"it-IT"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/it\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/it\/","logo":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/kinsta.com\/it\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/it\/wp-content\/uploads\/sites\/2\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/it\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/kinstaitalia\/","https:\/\/x.com\/Kinsta_IT","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinsta.com\/it\/#\/schema\/person\/4eee42881d7b5a73ebb4f58dd5223b21","name":"Jeremy Holcombe","image":{"@type":"ImageObject","inLanguage":"it-IT","@id":"https:\/\/kinsta.com\/it\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/0e17001f3bb37dbbe54fceef9bb547fa?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/0e17001f3bb37dbbe54fceef9bb547fa?s=96&d=mm&r=g","caption":"Jeremy Holcombe"},"description":"Senior Editor at Kinsta, WordPress Web Developer, and Content Writer. Outside of all things WordPress, I enjoy the beach, golf, and movies. I also have tall people problems.","sameAs":["https:\/\/www.linkedin.com\/in\/jeremyholcombe\/"],"url":"https:\/\/kinsta.com\/it\/blog\/author\/jeremyholcombe\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/it\/wp-json\/wp\/v2\/posts\/78510","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/it\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/it\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/it\/wp-json\/wp\/v2\/users\/199"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/it\/wp-json\/wp\/v2\/comments?post=78510"}],"version-history":[{"count":6,"href":"https:\/\/kinsta.com\/it\/wp-json\/wp\/v2\/posts\/78510\/revisions"}],"predecessor-version":[{"id":78518,"href":"https:\/\/kinsta.com\/it\/wp-json\/wp\/v2\/posts\/78510\/revisions\/78518"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/it\/wp-json\/kinsta\/v1\/posts\/78510\/translations\/en"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/it\/wp-json\/kinsta\/v1\/posts\/78510\/translations\/it"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/it\/wp-json\/kinsta\/v1\/posts\/78510\/translations\/pt"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/it\/wp-json\/kinsta\/v1\/posts\/78510\/translations\/fr"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/it\/wp-json\/kinsta\/v1\/posts\/78510\/translations\/de"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/it\/wp-json\/kinsta\/v1\/posts\/78510\/translations\/jp"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/it\/wp-json\/kinsta\/v1\/posts\/78510\/translations\/nl"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/it\/wp-json\/kinsta\/v1\/posts\/78510\/translations\/es"},{"href":"https:\/\/kinsta.com\/it\/wp-json\/kinsta\/v1\/posts\/78510\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/it\/wp-json\/wp\/v2\/media\/78511"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/it\/wp-json\/wp\/v2\/media?parent=78510"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/it\/wp-json\/wp\/v2\/tags?post=78510"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/it\/wp-json\/wp\/v2\/topic?post=78510"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}