 Benissimo Stefano è stato esaudiente, vi ha spiegato benissimo chi sono e cosa faccio, possiamo restare in contatto anche dopo questa presentazione, mi trovate un po' unque sul web con l'opseudonomo di Frank Grasso, link di Ne social vari, come preferite, come diceva sono uno sviluppatore di un'azienda che si chiama IT, difficilissima da pronunciare anche per noi, tranquilli, danziate voi che non sapete pronunciarla, nebbene noi sappiamo farlo. Questa azienda è nata creando temi, poi si è voluta creando plugin e con l'avvento dei temi a blocchi stiamo riprendendo a creare temi per WordPress e io mi occupo di questo aspetto dell'azienda in mezzo a mille altre cose, infatti sono un DevOps dell'azienda quindi ho un po' una visione totale di quello che c'è ovunque sui nostri sistemi. Curo il WordPress Meetup a Catania che attualmente in pausa perché per esigenze personali eccetera un po' gli organizzatori abbiamo un po' fatto un attimino un passo indietro ma stiamo lavorando dietro le quinte per riportarlo ai fastidai dei tempi e nel 2019, come diceva Stefano, c'è stato bellissimo Workup a Catania, un evento che è rimasta nel cuore di tutti i partecipanti. Benissimo, veniamo all'argomento di oggi abbastanza spinoso e esoterico per molti, no? Questo file in JSON, molti dicono che sarà mai questo file JSON, a cosa servono i file JSON? Ecco, se non sapete esattamente cosa sono ma ne capite un minimo, non bisogna essere dei grandi esperti dei guru della programmazione, se capite un attimino qual'è il concetto di array, possiamo definire il file JSON come un file di configurazione che è un grande array contenente altri array al suo interno. Questo file è uno dei file requisiti dei nuovi temi a blocchi perché sappiamo tutti che nei temi classici i file necessari per rendere un tema ciò che è sono i file index PHP e il file style CSS. Adesso nei temi a blocchi si aggiunge questo file che è il file team.json. Lo ripeto da una vita, il fatto che functions.php sia necessario una leggenda metropolitana, non è vero che necessario all'esistenza di un tema, semplicemente quello è un file che vi serve per aggiungere funzionalità a vostro tema, ma esattamente come per i temi classici non era necessario, non è necessario anche in questo caso. E credetemi, oggi più che mai con i temi a blocchi non è necessario, perché cose che prima riuscivate a fare solamente tramite configurazioni in PHP o scrivendo decine, se non centinaia di codici CSS per stilizzare, aspettivare il vostro tema, ad oggi li potete convertire in pochissime string, pochissime righe, di file team.json. Qualcuno ieri era il contributor day? Chi era al tavolo dei temi? Vabbè, vi ho portato qua allora. Ieri è stata una giornata interessantissima perché abbiamo realizzato dei temi a blocchi e abbiamo un attimino visto come sono strutturati questi temi e quante cose si possono fare grazie a questo singolo file. Abbiamo visto come aggiungere funzionalità, come abilitarle e oggi vedremo anche come disabilitarle. Questa è la sintasi standard, ovviamente compressa, se vedete lì ci sono delle parentesi graffi aperte e chiuse con questo non è un operatore di programmazione, non ci sono semplicemente dei tre punti per indicarvi qua dentro ci sta roba, non creiamo scompiglio, ci sono quattro macro, allora prima di trivarle quattro macro e aria abbiamo delle keyword essenziali, il primo che dichiara lo schema di questo file, secondo indica la versione, queste informazioni serviranno non solo a WordPress per leggere questo file, ma servono anche al vostro editor, si è utilizzando un editor revoluto che può essere anche vscode gratuito per tutti, in base a queste semplici due informazioni lui capirà cosa deve fare, cosa deve proporvi mentre iniziata a scrivere questo file da zero, non bisogna avere tutto stampato in testa, sotto la sezione settings cosa posso scrivere, devo ricordarmi qual'è la sintasi esatta delle parole chiave per indicare i colori, sotto styles eccetera, grazie a queste due dichiarazioni il vostro editor sarà in grado, chiaramente parliamo di un editor minimamente voluto, non parliamo del notepad, è chiaro per tutti, lui già vi proporrà, vi suggerirà quello che, le uniche keyword, le uniche istruzioni che potete inserire in ciascuno di questi blocchi, i blocchi essenziali, le quattro macro aree del file team JSON sono settings, styles, custom templates, templates part, settings appunto impostazioni, styles, definizioni di stili e modifiche di stile, custom templates, un tema a blocchi è caratterizzato dalla presenza di file HTML, siamo tornati all'HTML, si torna alle basi per andare, si torna indietro per andare avanti, cosa vi permette di fare? Non so se qualcuno di voi ha mai avuto a che fare con un tema classico, ci sono i file di template per le varie pagine, ma c'è il file per la front page, c'è il file on PHP per il blog, c'è il file single PHP per il single post del blog, c'è il file 404.php eccetera, la stessa cosa uno a uno la possiamo mappare nei temi a blocchi con dei file HTML, quale è la principale differenza di questi file? Mentre nei file PHP voi dovevate occuparevi di scrivere il loop, sapete cosa il loop è il sistema che vi permette di ciclare e recuperare i post, quindi i contenuti, l'informazione all'interno del vostro database WordPress, con tutte le conseguenze dei possibili errori che uno passa scrivendo il loop, perché magari mettete un parametro sbagliato, adesso ci sono in automatico questi vengono recuperati all'interno di questi file HTML o al massimo potete utilizzare dei blocchi che si occupano di fare il loop già per voi. Questi blocchi possono ricevere qualche personalizzazione, qualche parametro in ingresso, ma in generale sono già studiati per essere il loop delle pagine, il loop dei post eccetera. La vita si è naturalmente semplificata per chi deve realizzare un tema, c'è chi dice che è peggio, c'è chi dice che è meglio, c'è chi dice che i temi a blocchi sono più complessi dei temi classici, l'esempio che facevamo ieri al contributor day è questo. Qualcosa può essere difficile, complesso, ostico, solo a chi è già stato abituato per anni a anni a usare altro in un'altra maniera. Immaginate quando siamo passati tutti nei sistemi Windows dal vecchio XP, poi Vista, poi Sette, ancora ci piaceva, è piaciuto a tutti, poi è stato introdotto il sistema delle tiles su Windows 8, tutti è che schifo, è inutilizzabile, dove sono i miei pannelli impostazioni eccetera. Ma se ci pensate un attimo per un nuovo adopter di questo sistema, per un ragazzino che per la prima volta sta aprendo il computer e lo sta utilizzando, questo sistema era mille volte più intuitivo. La stessa cosa, adesso avviene, parliamo questa mattina con alcuni dei volontari su questi temi a blocchi. Prendete una persona che non ne capisce mondi un H di come funziona WordPress e che dietro di gestire i menu di un tema classico. Dovete andare a spiegare a quella persona che deve andare nel back end, deve andare in aspecto, deve andare in menu, deve capire se il programmatore è stato abbastanza gentile di utilizzare la keyword giusta, a cosa corrisponde quella menu location. Deve capire che Prime Rim Roo probabilmente è il menu che ci sta nel letter desito, ma se il programmatore è simpatico, il Prime Rim Roo può essere quello del future, simpatico tra apici grossi quantura casa chiaramente. Adesso con full site editing, persone fanno edit site, si apre la nuova interfaccia che ripeto un utilizzatore di quelli, lo zoccolo duro, temi classici, trova osta, appena la vede fa che sta roba, inutilizzabile, ma arriva una persona nuova. Guarda, c'è menu click, si aperta l'opzione del blocco e vede le voce di menu e l'esposta le modifiche, fa salva e automaticamente si è sistemato ed era il menu nella posizione che lui cercava. Se ci fermiamo un attimino il ragionario su questo, pensiamo che forse qualche passamante è stato fatto, non sarà tutto perfetto, non è ancora nella sua forma definitiva, ma per un buon 75-80% adesso è più che utilizzabile in produzione. Ci sono delle imperfezioni nel fare il re aperta i settings standard che sono quelli che si scrivono nel file team json, ma con un pizzico di pazienza arriveremo presto alla sua forma definitiva che è totalmente funzionante, ripeto, per una persona nuova che lo utilizza per la prima volta, molto più intuitivo questo. Siamo noi che continuiamo a pensare alla vecchia maniera. Il file team json in realtà non è l'unico file che viene preso in considerazione da WordPress per leggere le impostazioni che riguardano colori, stili, custom template, che sono quei template di cui parlavamo prima, 404 index, o le template parts. Template parts, perché prima ho dimenticato di dirlo, sono le sezioni del vostro sito, header, footer, se c'è un eventuale sidebar anche se ormai con full set editing l'editor ha blocchi a poco senso parlare di sidebar. Queste si pagina, mettete un bloc o due colonne di cui una a 75%, l'altra a 25% va a vedere la vostra sidebar, non dovete impazzire a impostare il template con sidebar a destra, a sidebar a sinistra, switchate le sidebar in un click, è un attimo. Le template parts definiscono questi layout, header, footer, etc., ne possono esistere molteplici e quando andate a fare edit side potete fare il replace dell'editor con un altro header o potete impostarne una per un template piuttosto che per un altro. In realtà il file team JSON non è l'unica configurazione che viene letta da WordPress, cosa vuol dire? Su quel file team JSON potrei scrivere solo i colori, potrei definire solamente la palette colori, la palette colori sono, quando andate a cliccare ad esempio sul paragrafo e vi propone di cambiare il colore del testo, vi vengono proposti dei colori standard e poi ci sono, qualora nel file team JSON sono definiti, sono degli altri colori sotto la voce è tema, questo vuol dire il tema sta aggiungendo questi colori. Questi servono per chi sta lavorando al sito ad avere una coerenza grafica, cromatica all'interno dei contenuti del proprio sito, sa che io ai paragrafi li posso fare verde e blu, il rosso non devo utilizzarlo perché magari è un altro elemento chiave del loco o non sta bene con la mia palette colori eccetera. Quindi il tema non è obbligato a definire tutto, perché? Perché WordPress ha già un file JSON, team JSON di configurazione che viene caricato in automatico, poi i singoli blocchi possono contenere all'interno un file JSON di configurazione, immaginate un plugin che va a creare dei blocchi aggiuntivi per il vostro tema, perché dobbiamo pensare anche un'altra cosa, esattamente come per i temi classici un tema non doveva occuparsi di definire shortcut, custom post type e quant'altro, nella stessa maniera un tema per essere tale, per essere accettato nella repository o comunque per rispettare determinati canoni, non deve definire, non sono quelle cose, ma nemmeno i blocchi, perché un tema deve solo vestire il sito, deve essere un aiuto per caricare e rappresentare contenuti, non deve definire la struttura dei contenuti. Noi stiamo crealizzando il sito web per una biblioteca, il post type dei libri non deve essere definito nel tema, ma deve essere definito in un plugin, perché se un giorno la biblioteca decide di fare un investimento e cambiare la grafica e rinnovarsi, e deve cambiare tema, se cambia tema perde tutto, mentre i libri deve continuare a vederli, magari non si vedranno con la stessa bellezza estetica di prima, ma si potrà lavorare e i contenuti non saranno mai persi. Quindi anche i blocchi possono definire un file team JSON personale, quel file gli serve per la configurazione, per istruire il site editor, a determinate impostazioni, perché quel bloc ha necessità di una palette colori dedicata, ha necessità di abilitare o meno la presenza di maiuscole minuscole, di definire delle font sites particolari, di avere uno spacing dinamico e quant'altro. Poi c'è il file team JSON del tema, che è quello di cui abbiamo discusso prima, il classico file, e poi ci sono le impostazioni dell'utente, cioè quando andate ad aprire edit site, modifica site, credo che si chiamano in italiano, scusate, ma lo uso principalmente in inglese, quando andate a cambiare qualsiasi impostazione lì da edit site, lì state creando delle impostazioni a livello utente, questo non deve farvi confondere, perché non vuol dire che se io Mario, se io Francesco ho modificato un'impostazione, poi visita il sito, il signor Giuseppe, e trova il sito con un'altra impostazione, per esempio, perché Mario e Francesco l'hanno editato, no, sono delle impostazioni a livello utente, quindi sono quattro livelli diversi, quattro layer. Perciascuno di questi layer, quindi, vengono definite delle impostazioni. Il sistema standard di WordPress è sempre stato basato nei temi classici, ma comunque nel suo funzionamento più base, sulla presenza di action hooks e filter hooks, i famosi ganci. Cosa è un filter hooks? È qualcosa che vi dice, c'è un determinato comportamento standard, io mi aggancio a questo comportamento e lo modifico secondo le mie esigenze, prendendo in pasto il vecchio comportamento, l'orio e l'abbro e te lo restituisco, lo filtro in un'altra maniera, mentre gli action hooks sono semplicemente dei punti di riferimento, quando arrivi a questo punto della procedura qua puoi fare qualcos'altro, oppure quando arrivi a questa procedura qua puoi rimuovere qualcosa. Ecco, tramite i filtri possiamo modificare il comportamento di qualcosa, che prima aveva un comportamento standard, filtrare è per noi sinonimo di modificare e di sovrascrivere qualcosa, aggiungere o addirittura sovrascrivere qualcosa, ok? Per ciascuno dei livelli di impostazioni date dal Team Jason, esiste un filtro corrispondente, andiamo un attimino a vedere quali sono. Il action hooks ha una radice comune, WP Team Jason data default, come vi dice la parola stessa, questo va a filtrare le impostazioni di default di WordPress. WP Team Jason data blocks, questo va a filtrare le impostazioni che sono state introdotte dal blocco, qualora il blocco abbia un file Jason di configurazione. Poi abbiamo WP Team Jason data team, questo va a sovrascrivere le impostazioni che sono state introdotte dal tema tramite file Team Jason e poi per ultimo la WP Team Jason data user, questo va a sovrascrivere le impostazioni che sono state assegnate dall'utente, dovete capire che qui c'è anche un sistema di priorità in tutto questo, perché vanno a cascata, quello che definisce blend cancela WordPress può essere sovrascritto dal blocco. Quello che definisci il blocco può essere sovrascritto dal tema. Se addirittura l'utente ha applicato delle modifiche tramite site editor, le modifiche dell'utente sono legge, sono quelle e basta, vanno a sovrascrivere tutto quello che ci sta sopra, quindi priority is king. Se io voglio andare a modificare un comportamento standard di WordPress, vado ad utilizzare uno qualsiasi di questi blocchi e mi va benissimo. Ma se voglio vincere sul tema, io devo andare a sovrascrivere qualcosa tramite questo filter. Se voglio che l'utente non possa fare determinate modifiche, io mi metto qui, mi metto a Jason data user e qui non ci sono scuse, qui l'utente può fare quello che vuole, ma vincco io e vi faccio un esempio praticissimo. Scusate, questa è una slide spiritosa che si dice sempre, ogni anno viene detto il PHP è morto, ogni anno questa cosa, quando sono state introdotti temi a blocchi. Adesso tu ti troverai a scrivere HTML e CSS, basta. E poi se sei bravo, bravo, scrivi JavaScript React, basta, non lo tocchi più il PHP. Signorimie, questi qui sono filtri, abbiamo detto, i filtri, come si fanno in WordPress? Si fanno con il PHP, è così, PHP, ne gioisce sodium grande. Dice io non sono morto, ogni anno mi ammazzate, io torno sempre in vita, alla Terminator. Vi faccio adesso un esempio che vi fa capire l'utilità di tutto questo e le sue infinite potenzialità. Una domanda che mi è stato fatto ieri da tutti al tavolo. Io ho configurato questo tema, lo ho creato, è bellissimo, full set editing però è troppo. Io ho confezionato il sito al massimo, lo ho dato al mio cliente, si è messa a smanettare, ha distrutto la struttura dei post, mi ha distrutto tutto. Adesso mi ha fatto i paragrafi enormi, alcuni piccolissimi, eccetera, perfetto. Adesso lo sistemiamo noi l'utente in base alle sue capabilities. Proviamo adesso di evitare che l'utente possa cambiare i colori per tutti gli utenti che hanno un ruolo infinito di una colore degli addimini, quindi gli editor. Devono solo scrivere senza cambiare i colori in questo esempio. Qual è il filtro che ci serve? Data user, perché non vogliamo che sia l'utente. Noi dobbiamo scrivere proprio il comportamento dell'utente. Il codice è facilissimo. Il filtro da utilizzare è questo, addfilter, teamjson data user, a questo agganciamo la nostra funzioncina. Tutto questo chiaramente va fatto dopo che il tema è stato caricato e sta funzionando. Ma questo non è oggetto del talk, perché questo è comportamento standard di quando uno deve fare filtri sul tema e quant'altro. Quindi ci agganciamo qui e diciamo all'utente che deve avvenire quello che c'è dentro questa funzione. Cosa gli diciamo? Se l'utente non può editare il team option e questa è una delle capabilities che ha all'utente amministratore, poteva anche essere not current user can administrator, stessa cosa. Ci va benissimo, però questo è una capabilities molto specifica che può essere stata modificata con vari plugin che vanno a rimuovere e aggiungere capabilities agli utenti. Noi gli diciamo, io adesso qua dentro questa variabile restrictions, ma si poteva chiamare Pippo, Bluto, Paperino, per noi va benissimo, ti vado a definire un array, il teamjson, di cosa è? Detta la spicciola, un array di array, gli passo. Ok, io sto scrivendo nella versione 2 del file teamjson di WordPress. La versione 1 è stata utilizzata agli albori, già siamo alla 2, quindi. Però per sicurezza noi gli passiamo questo. Poi diciamo, vai nella sezione settings del file teamjson, individuati il blocco color con questa informazione chiave e qua dentro io posso definire varie proprietà che ci vengono date in aiuto dalla definizione di schema e diversion. Io ti dico, il colore del testo non lo deve poter impostare. I colori di background non li deve poter impostare. I colori dei link non li deve poter impostare. L'utente dei colori non li deve toccare. Prendo questa variabile è con update with, che è una funzione di teamjson, che è sostanzialmente il file che diamo in pasto al nostro filtro e in questo modo prendo qualcosa, la rielabolo, la rimastico e ritorno indietro. Update with, prendi questo file teamjson, aggiornalo con queste restrizioni e poi alla fine, come tutti i filtri, devo restituirti quella cosa elaborata, rimasticata, modificata. La diamo in pasto e vediamo cosa è successo. Questa è la condizione standard che abbiamo nel nostro editor, questo è il colore che stiamo provando a modificare il colore del testo di questo paragrafo. Appena clicco per scrivere misabilità color, e ci sono texture background. Quando c'è il divieto d'accesso, attenzione, non vuol dire vietato, vuol dire sto utilizzando qualcosa di default. Qui Stefano, si dovrebbe parlare un attimino che non è troppo indicativo che questo vuol dire sto utilizzando il colore di default, no? Vedete che ci sono attive le opzioni dei colori. Adesso applico il mio filtro, ho scritto quella porzioncina di codice nel functions.php che è tornato in vita, etc. Del mio child team. E adesso la persona ha cliccato sul paragrafo e non c'è più color. C'è la possibilità di gestire bordi, dimensioni, quant'altro sia stato abilitato nel file teamjson, ma color non c'è più. E quindi, ciao ciao errori. C'è proprio l'utente, deve essere passati i miei termine, non lo posso dire, e andare in modalità codice e andare a scrivere l'HTML. Però io non glielo adata l'impostazione per farlo. Questo ci permette di personalizzare base alle esigenze del nostro cliente, rendere sicuro un prodotto che non abbiamo rilasciato per i nostri clienti e per evitare l'errore umano, quindi realizzare una soluzione ad hoc unica e personalizzata per quell'utente. Se pensate, le modifiche che potete fare sono infinite, non potete solo togliere, potete anche aggiungere. Qui abbiamo fatto un esempio di sicurezza, ma ci sono mille altre cose che possono essere fatte. Non solo gestire il colore, ma tipografia, opzioni di blocco, la possibilità di rimuovere le colonne, volete che siano solo a larghezza automatica, quindi gli levate la possibilità di mettere la percentuale, potete fare di tutto. Con questo io vi saluto perché il tempo è rimasto. L'esempio che vi ho fatto è un esempio disponibile su WordPress.org, alla sezione developer. È un esempio standard classico volutamente, ho messo quelli in modo che potete andarvi a revisionare i codici 100 volte meglio riguardo una slide perché potete banalmente copiarli e incollarlo. E poi vi invito a visitare questo bellissimo sito, FullsetEditing.com di Carolina Nemar, spettacolare sito per imparare i temi a blocchi, mille volte meglio di qualsiasi codex, documentazione che vogliate. Questo deve essere la vostra Bibbia. Basta, io ho finito. Grazie mille Francesco. Un applauso ancora.