[Polyglots] Resoconto riunione del 20 febbraio 2022

Presenti

@darkavenger, @deadpool76, @lasacco, @lidialab, @piermario

Svolgimento della riunione

Resoconto gruppi di lavoro

Piermario ha informato la riunione che il 16 febbraio è stata pubblicata la versione 12.6 del plugin Gutenberg. 

La traduzione italiana del plugin è attualmente al 100%

È stato dato poi un aggiornamento sui progetti Openverse e Learn WordPress.

La traduzione italiana dell’interfaccia utente di Operverse è al 99%, tuttavia non è ancora disponibile sul sito. Siamo in attesa che il team che si occupa del progetto rilasci un aggiornamento che renderà visibile anche la localizzazione italiana, che per il momento è visualizzata parzialmente.

La localizzazione del progetto Learn WordPress è al 94%. L’interfaccia italiana è già disponibile sul sito, visibile su https://learn.wordpress.org/?locale=it_IT.

Il prossimo passo sarà la creazione di contenuti o traduzione in italiano dei corsi e lezioni già disponibili. Al momento il team internazionale non ha ancora definito le modalità con cui verranno gestite le traduzioni. Stiamo in attesa di informazioni dal team che si sta occupando del progetto, sul canale #training dello Slack internazionale.

Riguardo il programma Full Site Editing, Piermario ha ricordato che è in corso una esplorazione che questa volta si concentra sull’uso dei media all’interno di WordPress. 

La traduzione italiana con tutte le informazioni per contribuire è disponibile sul blog del team italiano a questo indirizzo: https://it.wordpress.org/team/2022/02/07/esplorazione-per-il-programma-fse-tutto-quello-che-fa-media/

Traduzione delle stringhe

Dopo aver fatto un riepilogo delle stringhe approvate durante la scorsa riunione, abbiamo discusso la traduzione della stringa List View, a seguito di una proposta avanzata recentemente da Luisa Ravelli. È stata quindi aperta una votazione sulle proposte di traduzione per questa stringa.

Lidia ha successivamente proposto di esaminare, una volta approvata una traduzione per “List view”, anche la stringa “Grid view”, dato che spesso le due appaiono vicine o nella stessa frase. Lo scopo è di armonizzare e rendere più omogenee le traduzioni. 

In chiusura di riunione, Lidia ha fatto un riepilogo delle modalità di compilazione del resoconto settimanale, e fornito un link ad un documento Google con modello da usare come riferimento, che successivamente potrà essere inserito nell’handbook.

Lidia ha inoltre ricordato che fino a domenica 20 febbraio c’è la possibilità di esprimere il proprio a partecipare al test della nuova funzione di GlotPress che consentirà discussione e feedback sulle stringhe per Translate.

La prossima riunione si terrà giovedì 24 febbraio alle ore 19:00

#polyglots, #glossario, #gutenberg, #openverse, #LearnWordPress, #resoconto

Esplorazione per il programma FSE: Tutto quello che fa Media

Dopo il rilascio della versione 5.9, i componenti più importanti di full site editing sono disponibili a tutti e pronti a ricevere feedback. Per il momento, anziché addentrarci ancora una volta in questi componenti, abbiamo deciso di lasciare che il pubblico ci prenda confidenza e passare ad un aspetto della creazione di un sito che può determinare il successo o il fallimento di un progetto: il ruolo dei media. Che si tratti di impostare un’immagine in evidenza o aggiungere un’immagine ad un header, ci sono parecchi modi in cui i media sono in contatto con tutte le parti della creazione di un buon sito. 

Come l’ultima volta, in questa esplorazione ci concentriamo sul pensare più a lungo termine, con una prospettiva più da “sarebbe bello se”, in modo da raccogliere spunti utili che contribuiranno a far evolvere il design delle esperienze relative ai media nel corso dello sviluppo futuro. Per fare questo, ti guideremo attraverso alcune operazioni comuni della costruzione di un sito che coinvolgono i media, e chiederemo ad ognuno di voi di pensare in modo creativo a ciò che vi piacerebbe succedesse. Dato che questa non è proprio una chiamata per il test a causa della mancanza di procedure da seguire, ci concentriamo meno sul trovare dei bug (anche se sono sempre ben accette delle segnalazioni) e più sul ragionare su cose che vorresti succedessero. 

Man mano che esamini l’articolo, ricorda che puoi occuparti di tutti questi spunti o anche di uno solo! In ogni caso, è tutto utile.

Una breve panoramica

Parte del motivo per cui stiamo facendo questa chiamata è la presenza di alcuni nuovi progetti e strumenti che ruotano sui media all’interno del progetto WordPress, che potrebbero esserti sfuggiti: la Directory delle Foto di WordPress ed Openverse. 

La WordPress Photo directory è attualmente in beta, ed ha lo scopo di offrire una fonte curata di immagini di alta qualità. Aggiungendo qui le tue foto, le foto appariranno automaticamente in Openverse, un motore di ricerca per media con licenza aperta composto da oltre 600 milioni di elementi da usare gratuitamente. In questo momento, questi sono strumenti a sé stanti, ma nel futuro ci saranno grandi opportunità per integrarli direttamente all’interno dell’esperienza di WordPress. Questa esplorazione contribuirà a guidare la fase iniziale di questo lavoro che è anche in linea con vari obiettivi per il 2022.

Per leggere di più riguardo la WordPress Photo Directory e Openverse, dai un’occhiata a questo articolo che condivide tutto quello che c’è da sapere.

Compito 1: Esplorare cosa è possibile in questo momento

Questi compiti hanno volutamente obiettivi aperti dato che ci sono spesso vari modi in cui possono essere completati. Quando rispondi di seguito, condividi quali approcci/procedure hai utilizzato e perché! Condividi nei commenti anche eventuali bug dovessi trovare.

  • Applica un filtro Bicromia ad un blocco copertina, con un’immagine o video al suo interno, ed aggiungici sopra del testo, regolando l’opacità quanto necessario. 
  • Aggiungi un’immagine come sfondo del tuo header.
  • Aggiungi una didascalia ad un’immagine.
  • Ritaglia o ruota un’immagine in un blocco galleria.
  • Aggiungi un’immagine esterna non coperta da copyright sul tuo articolo come immagine in evidenza. Punti bonus se ci fai sapere dove hai cercato l’immagine e dove fai normalmente queste ricerche. 
  • Cambia la dimensione dell’immagine in evidenza per i tuoi articoli, modificando il tuo template dell’articolo.

Per questa esplorazione, sarebbe utile usare un tema basato su blocchi, dato che lo scopo è descrivere l’uso di media nel contesto del full site editing. Come risultato, segui questi passaggi: 

  1. Imposta un sito di prova. Puoi seguire queste istruzioni per creare un’installazione locale o utilizzare uno strumento come questo per impostare un sito di sviluppo
  2. Installa ed attiva un tema basato su blocchi scegliendolo tra le opzioni disponibili nella directory dei temi

Compito 2: Descrivi quello che vorresti vedere

Man mano che prosegui tra le esperienze riportate in precedenza, considera le seguenti domande come uno spunto di riflessione su ciò che vorresti vedere in futuro. Questo potrebbe includere qualunque cosa, dalla possibilità di usare un’immagine in evidenza come sfondo di un blocco copertina, ad avere a disposizione più controlli integrati per stilizzare le tue immagini, fino a ripensare le immagini in evidenza in generale. Condividi pure ciò che vuoi e non preoccuparti di quanto possa essere pratica o meno un’idea. Questo serve ad avere un’idea di ciò che chi utilizza WordPress vorrebbe vedere in futuro. Rispondi ad una, a tutte o a nessuna di queste domande! Sono intese proprio per farti ragionare nel giusto ordine di idee, piuttosto che fornire delle caselle da spuntare: 

  • Come ti piacerebbe vedere Openverse o la WordPress Photo directory integrate nell’esperienza?
  • Cosa ti viene in mente quando pensi a Pattern e media?
  • Quali miglioramenti del flusso di lavoro ti vengono in mente? Cosa è stato difficile da ottenere?
  • Quali compiti di base devi fare fuori da WordPress per preparare come si deve i tuoi media e come vorresti che questi passi fossero integrati all’interno dell’esperienza?
  • Cosa ne diresti di utilizzare un’immagine le cui informazioni di attribuzione non possano essere rimosse? E di un’immagine su cui non puoi fare modifiche significative?
  • Qualunque altra cosa? Pensa in grande!

Condividi il tuo feedback entro mercoledì 23 febbraio 2022

Come sempre, grazie per la tua partecipazione a questo esercizio. Se qualcosa ti impedisce di partecipare, faccelo sapere in #fse-outreach-experiment, nei commenti a questo articolo oppure via DM in slack ad @annezazu (l’autrice dell’articolo originale!). Considera che non tutto quello che viene condiviso qui sarà implementato data la natura di questa esplorazione, ma sappi che le tue idee aiuteranno sicuramente a dare forma a ciò che sarà possibile nel futuro.

Unisciti ad una chiacchierata “in piazzetta” il 16 febbraio 2022 @ 5:30PM UTC 

Se vuoi andare ancora un po’ più a fondo in questa esplorazione e chiacchierare di Tutto quello che fa Media, unisciti a @fcoveram ed @annezazu nella nostra prossima chiacchierata estemporanea. Ti ricordiamo che queste sono chiamate informali ed aperte, a cui chiunque può unirsi o lasciare a piacimento, con videocamera accesa/spenta, per parlare o solo per ascoltare! Durerà meno di un’ora è sarà poi riassunta su Make Test

Per essere dei nostri, visita #fse-outreach-experiment in Make Slack, su cui condivideremo un link all’ora della diretta. 

#fse-exploration, #fse-outreach-program, #fse-testing-call, #full-site-editing

Aiuta a testare le funzionalità di WordPress 5.9

(Articolo originale pubblicato da @annezazu il 30 Novembre 2021 su make.wordpress.org)

Con il rilascio di WordPress 5.9 previsto per il 25 gennaio 2022, questo articolo ha lo scopo di riassumere tutti i modi con cui si può contribuire a testare funzionalità specifiche che saranno incluse in questa versione. Tutto questo allo scopo di coadiuvare e sostenere le attività di test in corso per la versione 5.9.

Nota importante: Qualunque punto contrassegnato come [Tecnico] è più adatto ad utenti più a loro agio con metodi di test più avanzati. 

Ambiente di test

Effettua i test solo su siti di sviluppo e non su siti di produzione/live. Puoi seguire queste istruzioni per impostare un’installazione locale o usare uno strumento come questo per predisporre un sito di sviluppo

Una volta che il sito di sviluppo è pronto, installa ed attiva il plugin WordPress Beta Tester ed impostalo in questo modo: 

  • Aggiorna il canale su “Bleeding edge”
  • Stream options su “Beta/RC only”

Nel caso avessi necessità di passi più specifici, qua trovi istruzioni più dettagliate da seguire

Consigli per i test

In generale, ci sono alcuni consigli da tenere a mente per ottenere il più possibile dal tuo contributo ai test:

  • Prova a fare i test su diversi browser.
  • Prova a fare i test in diverse lingue
  • Verifica l’aspetto delle funzionalità su schermi di dimensioni diverse
  • Prova ad usare solo la tastiera o uno screen reader
  • Esplora utilizzando sia temi a blocchi che temi classici.

Funzionalità da provare

Il tema a blocchi predefinito Twenty Twenty-Two

Quando devi scegliere un tema da usare per il tuo sito di prova, utilizza il tema Twenty Twenty-Two theme. Si tratta del primissimo tema basato su blocchi ed ha perciò necessità di test approfonditi. Qua puoi leggere di più riguardo questo tema. Puoi provare il tema installandone la versione Beta ed attivando Twenty Twenty-Two da Aspetto > Temi. Nel caso volessi riportare dei problemi con il tema, puoi farlo qui.

Percorsi per temi a blocchi 

Dato che i temi a blocchi aggiungono la possibilità di modificare più parti del tuo sito, sono stati aggiunti dei nuovi percorsi per rendere più intuitivo l’accesso agli elementi, quali l’editor dei template, tramite cui puoi apportare i cambiamenti che vuoi alla tua home page o alla pagina 404. Questi flussi di lavoro e nuove funzionalità hanno necessità del tuo aiuto con i test!

Per avere delle procedure più dettagliate su come provare questi nuovi flussi di lavoro, segui questa chiamata per il test che tratta dell’uso degli stili, modalità di modifica di singole parti del template, ed altro ancora.

Temi a blocchi con un accento sul blocco navigazione

Dato che il Full Site Editing è una raccolta di funzionalità che consentono una facile modifica di vari elementi senza la necessità di sapere come scrivere codice, sono stati creati nuovi blocchi per includere ancora più parti del tuo sito. Questi blocchi sono chiamati generalmente “Theme Blocks” (blocchi del tema), dato che corrispondono a funzionalità che in precedenza erano incluse all’interno dei temi. Anche se una serie di theme block (blocchi del tema) è stata già inclusa in WordPress 5.8, c’è ancora molto lavoro da fare, incluso rendere disponibili ancora più theme block all’interno di versioni future!

Per avere una procedura più dettagliata su come provare il blocco navigazione, segui questa chiamata per il test che tratta della creazione di due diversi menu.

Visualizzazione in modalità elenco

Ci sono alcuni miglioramenti di cui tenere conto riguardo la visualizzazione in modalità elenco, inclusa la possibilità di fare trascina e rilascia con i blocchi, e la possibilità di ridurre delle sezioni per rendere più semplice la navigazione di contenuti complessi. Man mano che esplori la versione 5.9, prova ad usare la visualizzazione in modalità elenco in varie situazioni per assicurarti che funzioni bene e sia facile da usare.

Strumenti di design

Lo sforzo di rendere disponibili strumenti di design migliori e più consistenti continua a progredire con nuove opzioni aggiunte, un’interfaccia più intuitiva ed altro ancora. Bastano alcune combinazioni di queste impostazioni per creare layout completamente diversi, che vanno da alcune piccole modifiche fino ad opzioni più radicali e complesse. 

Anche se sono stati aggiunti un mucchio di strumenti ai vari blocchi, sono solo alcuni quelli su cui ci concentreremo per i test:

  • Blocco pulsante: spazio tra blocchi, controlli dei bordi, controlli di dimensione (spaziatura interna).
  • Blocco colonne: spazio tra blocchi, controlli di dimensione (spaziatura interna).
  • Blocco navigazione: layout flex, spazio tra blocchi, controlli di layout (verticale, orizzontale, allineamento).
  • Blocco gruppo: controlli di layout, controlli di dimensione (spaziatura interna).
  • Blocco copertina: bicromia, controlli di dimensione (spaziatura interna, altezza minima).
  • Blocco icone social: controlli di layout (verticale, orizzontale, allineamento), spazio tra blocchi, controlli di dimensione (margine).
  • Blocco immagine in evidenza: bicromia, controlli di dimensione (larghezza, altezza, margine, spaziatura interna).

Blocco galleria 

Grazie ad una completa riprogettazione del blocco galleria, ora puoi usare gli stessi strumenti disponibili sui singoli blocchi immagine su ogni immagine del blocco galleria. Questa aggiunta flessibilità significa che puoi fare più personalizzazioni – dall’aggiunta di link ad ogni singola immagine, ritaglio inline e modifica al volo, applicare stili unici per rendere più interessanti le immagini ed applicare una serie di filtri bicromia. Puoi trovare di più da leggere riguardo questa modifica

I seguenti elementi hanno una priorità alta nei test:

  • [Tecnicol] Se sei un autore di plugin o temi che ha usato in precedenza il blocco galleria, segui queste istruzioni per assicurarti di essere preparato alla versione 5.9.
  • Prova la compatibilità all’indietro creando un blocco galleria con WordPress 5.8.2 per poi passare alle prime versioni della 5.9.
  • Esplora l’uso degli strumenti stessi del blocco galleria. Prova a ritagliare delle immagini, riordinarle, aggiungere del testo alternativo ed altro ancora. 
  • Fai delle prove che coinvolgono plugin di terze parti che potresti usare per le gallerie, in modo da assicurarti che le trasformazioni funzionino. Se non funzionano, la cosa migliore è contattare chi sviluppa il plugin per farglielo sapere. 

Per dare del contesto aggiuntivo, tieni presente che il nuovo blocco galleria è incluso nella Beta 1, ma la migrazione automatica dei blocchi galleria esistenti sarà incluso nella Beta 2. Come risultato, per la Beta 1 sarai in grado di provare il nuovo blocco galleria aggiungendo una nuova galleria, ma, per migrare una galleria creata con il vecchio formato, dovrai farlo manualmente utilizzando il pulsante Aggiorna nella barra degli strumenti del blocco. 

Esploratore dei block pattern

L’esperienza dell’aggiunta di modello (patterns) dall’Inserter è stata appena rinfrescata con l’introduzione di una nuova finestra modale che ti permette di vedere i modelli (pattern) in modo più organizzato con anteprime più grandi. Per quanto riguarda il test, gli elementi da provare sono piuttosto semplici:

  • Seleziona ed aggiungi modelli (pattern) all’interno del tuo contenuto. 
  • Scorri tra diverse opzioni di modelli (pattern).

Aggiornamenti generali in arrivo nel Core

Oltre a queste funzionalità più specifiche, ci sono anche degli aggiornamenti generali in arrivo con questa versione che sarebbe molto utile aver provato:

Dove inviare il tuo feedback

Nel caso dovessi trovare dei problemi, la cosa migliore è condividerli sui forum alpha/beta, oTrac se sei più a tuo agio tecnicamente e ad un livello più avanzato. Condividi il tuo feedback il più presto possibile prima della pubblicazione, fissata per il 25 gennaio 2022.

Grazie a@justinahinon @boniu91 @cbringmann @hellofromtonya e @webcommsat per le revisioni ed i contributi a questo articolo.

#5-9, #fse-outreach-program, #full-site-editing

Chiamata per il test del programma FSE #11: Un safari nella modifica di un sito

Questa è l’undicesima chiamata per il test all’interno del Full Site Editing Outreach Program! Per sapere di più su questo programma di divulgazione, dai un’occhiata a  queste FAQ con utili dettagli. Per entrare nel vivo, vai su #fse-outreach-experiment in Make Slack per futuri annunci su nuovi test, articoli e molto altro ancora.

Ti ricordiamo anche che nel caso volessi suggerire un’idea per una chiamata per il test, ogni proposta è molto gradita e tutte le idee saranno valutate secondo le attuali priorità del progetto per stabilire quale ha più senso affrontare. Puoi anche condividere direttamente idee nel canale Slack  o via DM, scrivendo ad @annezazu

Panoramica

Puoi saltare direttamente ai passi del test se preferisci iniziare immediatamente.

Questa è l’ultima chiamata per il test prima di WordPress 5.9, il che la rende una chiamata fantastica  e di grande impatto a cui prendere parte, perché migliorerà l’esperienza di una grossa fetta del web anche già prima che sia lanciata. Per ottenere il massimo da questa chiamata per il test, le istruzioni cambieranno man mano che il test prosegue ed avanziamo nel ciclo delle nuove versioni. Ad esempio, all’inizio di questo test, incoraggeremo l’uso di TT1 e, verso la fine del test, sarà consigliato l’uso di Twenty Twenty-Two. Al momento ecco una panoramica generale di quanto sarà oggetto del test: 

Il template del tema a blocchi e la parte della UI dedicata alla modifica del template

Anche se in alcune chiamate per il test abbiamo già affrontato l’Editor del sito, l’esperienza così come l’avete conosciuta sta cambiando in vista della 5.9 in modo da offrire un’esperienza più rifinita e ridimensionata per la gestione dei template e delle parti del template all’interno di un tema a blocchi. Con uno strumento di navigazione condensato ed una nuova posizione all’interno di wp-admin sotto Aspetto, questo potrebbe sembrare un assaggio, più che l’esperienza completa dell’Editor del sito così come l’avete conosciuto finora.

Interfaccia degli stili

Laddove la versione 5.8 ha gettato le fondamenta per uno stile di sistema coerente, la 5.9 vede l’introduzione di una bella interfaccia utente che permette di interagire direttamente con le varie proprietà di stile. Potreste aver già sentito parlare di questo lavoro sotto il nome di lavorazione di “global styles”! Anche se abbiamo condotto delle chiamate per il test riguardo theme.json, uno dei meccanismi collegati al progetto Global Styles in generale, questa è la prima volta che l’utilizzo degli stili viene esplorato. Attualmente, l’interfaccia visualizza due gruppi su cui si focalizza il design: blocchi ed elementi. Gli elementi rappresentano cose a cui può essere attribuito uno stile in modo globale ed attraverso i blocchi (ad esempio, “testo”, “link”, “citazioni”, ecc.) Questo è un modo più raffinato per dire che è possibile cambiare la tipografia di tutto il sito o del colore unico di tutti i blocchi pulsante, tutto da una sola interfaccia. 

Patterns Explorer

Con i modelli di blocchi (block patterns) in grande spolvero, è stata inclusa una nuova finestra modale di esplorazione per rendere più semplice la navigazione tra i modelli e trovare esattamente quello che vuoi utilizzare. Questo pone le basi per la futura integrazione della Directory dei pattern. Questo test esplora brevemente questa nuova esperienza. 

Twenty Twenty-Two

Twenty Twenty-Two è l’ultimo di una lunga serie di temi predefiniti ma con una sorpresa — innanzitutto è un tema a blocchi, costruito espressamente per i vari strumenti del site editing. Come risultato, a metà strada di questa chiamata per il test chi partecipa al test sarà incoraggiato a svolgere il test usando questo tema e riportando le loro impressioni. Leggi di più riguardo questo rivoluzionario tema predefinito qua

Ambiente di test

Questa sezione sarà corretta man mano che il test prosegue e che il ciclo di rilascio progredisce, in modo da fornire a chiunque contribuisca le condizioni migliori e più recenti. 

Ecco i passi da seguire per impostare in modo corretto il tuo ambiente di prova per questo test in particolare. Se è tutto pronto per iniziare, puoi saltare ai passi per il test indicati di seguito.

  1. Usa un sito di prova con la versione più recente di WordPress. Attualmente è la 5.8.2. È importante che questo non sia un sito di produzione / live. 
  2. Installa e attiva il plugin Gutenberg da Plugin > Aggiungi nuovo. Se il plugin è già installato, assicurati di usare come minimo Gutenberg 12.0.
  3. Installa il tema TT1 Blocks andando su Aspetto > Temi > Aggiungi nuovo. Una volta installato, attiva il tema.
  4. Crea alcuni articoli con immagini in evidenza di tua scelta. In alternativa, puoi scaricare ed importare il contenuto demo di Gutenberg creato in precedenza per questi tipi di test, tramite l’importatore di WordPress che trovi sotto Strumenti >  Importa. Puoi anche seguire questa lezione su come usare il contenuto demo.
  5. Apri la schermata di amministrazione del sito
  6. Dovresti ora vedere una voce di navigazione sotto Aspetto, chiamata “Editor (beta)”. Se non la vedi, il tuo ambiente non è predisposto correttamente. Se arrivi ad un punto morto, commenta questo articolo o chiedi aiuto su #fse-outreach-experiment!

In generale, usa le versioni più recenti di ogni componente sopra citato e tieni presente che le versioni potrebbero essere cambiate da quando l’articolo è stato condiviso.

Passi per il test

Personalizza la tua homepage

  1. Vai su Impostazioni > Lettura ed imposta “La tua homepage mostra” per visualizzare “Gli ultimi articoli”.
  1. Una volta salvata questa impostazione, vai su Aspetto > Editor (beta). Questo si aprirà per visualizzare un template che mostra la tua home page.
  1. Da qui, cambia la tua home page come preferisci! Questo può voler dire cambiare un blocco di navigazione, cambiare la dimensione del font dei tuoi blocchi Titolo dell’articolo, aggiungere un filtro bicromia ai blocchi Immagine in evidenza dell’articolo, eliminare blocchi, aggiungere blocchi, ed altro ancora. 
  1. Una volta che hai fatto tutte le modifiche in base ai tuoi gusti, clicca “Salva” e completa l’esperienza di salvataggio. 

Imposta i tuoi stili

  1. Da qui, fai clic sull’icona Stili nell’angolo in alto a destra per accedere all’interfaccia degli Stili.
  1. Una volta aperta, personalizza le quattro sezioni quanto preferisci, in base ai tuoi gusti: Tipografia, Colori, Layout e Blocchi (per personalizzare singoli blocchi). Ad esempio, puoi fare clic su Colori > Tavolozza > e usare il segno + per aggiungere la tua opzione di colore personalizzata da usare in tutti i tuoi contenuti.
  1. Una volta che hai sistemato tutto in base alle tue preferenze, fai clic su “Salva” e completa l’esperienza di salvataggio.
  1. Da qui, apri l’Inserter e passa alla scheda Modelli.
  1. Seleziona l’opzione “Esplora”, naviga fino alla sezione Pulsanti e scegli il modello “Semplice invito all’azione”.
  1. Una volta aggiunto, usa l’opzione + per aggiungere un secondo pulsante. 
  1. Da qui, seleziona il blocco genitore generale Pulsanti ed apri le impostazioni della barra laterale per personalizzare il layout in base ai tuoi gusti. Ecco un veloce video nel caso in cui dovessi bloccarti.
  1. Salva le modifiche.

Aggiungi un filtro bicromia al tuo template Archivio.

  1. Fai clic sul menu W nell’angolo in alto a sinistra > sotto Editor seleziona > Template > Seleziona “Aggiungi nuovo” > Seleziona “Archivio” (al momento non è possibile creare un template generale da qui).
  1. Nel contenuto, inserisci il blocco Immagine in evidenza dell’articolo e aggiungi un filtro bicromia.
  1. Inserisci qualunque altro blocco aggiuntivo che vuoi e salva le modifiche quando è tutto pronto.
  1. Torna sulla tua bacheca facendo clic sull’icona W nell’angolo in alto a sinistra prima di andare su Articoli > Tutti gli articoli.
  1. Modifica uno dei tuoi articoli con un’immagine in evidenza ed assegna il tuo nuovo “Template bicromia” a questo articolo. Ecco un breve video nel caso dovessi bloccarti.
  1. Salva e visualizza l’articolo per vedere il filtro applicato!

Modifica la tua header

  1. Torna su Aspetto > Editor (beta) e, usando la visualizzazione in modalità elenco se necessario, seleziona la tua parte del template Header.
  1. Seleziona il menu con tre puntini nella visualizzazione in modalità elenco o nella barra degli strumenti del blocco e seleziona “Modifica header”. Questo attiverà la modalità di modifica in evidenza per questa parte del template.
  1. Da qui, fai alcune modifiche alla parte del template (aggiungi elementi al blocco di navigazione, cambia la dimensione del titolo del tuo sito, ecc) e usa le maniglie di trascinamento in orizzontale per vedere l’aspetto del tuo header in diverse dimensioni!
  1. Salva le modifiche.

Cosa notare:

  • L’esperienza si è bloccata in qualche punto?
  • L’esperienza di salvataggio ha salvato correttamente le tue modifiche?
  • Hai trovato delle funzioni mancanti? 
  • Cosa hai trovato particolarmente confuso o frustrante riguardo l’esperienza?
  • Cosa ti è piaciuto o hai apprezzato in modo particolare riguardo l’esperienza?
  • Cosa avrebbe potuto rendere più semplice questa esperienza?
  • Credi che quanto creato all’interno dell’editor del sito corrisponda a quello che vedi sul tuo sito?
  • Come si presentava il tuo contenuto su un dispositivo o una dimensione di schermo più piccoli?
  • Come pensi questo possa influenzare i flussi di lavoro attuali?
  • Ha funzionato usando solo la tastiera?
  • Ha funzionato usando uno screen reader?

Lascia un feedback entro il 7 dicembre 2021

Lascia un feedback nei commenti di questo articolo. Se preferisci, puoi sempre creare delle issue in questo repo GitHub direttamente per Gutenberg. Se lasci un feedback in GitHub, commenta comunque di seguito indicando il link. Se vedi che qualcun altro ha già segnalato un problema, lascia comunque una nota qui di seguito riguardo la tua esperienza, sarà utile per fornire a chi sta lavorando una panoramica più ampia su ciò che va migliorato.

Grazie a @kellychoffman per avermi aiutato con le revisioni di questa chiamata per i l test.

Changelog

Nov 10: aggiornate le istruzioni per usare Gutenberg 11.9 RC4.

Nov 12: aggiornate le istruzioni per usare Gutenberg 11.9.

Nov 13: aggiornate le istruzioni per usare Gutenberg WordPress 5.8.2.

Nov 24: aggiornate le istruzioni per suggerire l’uso di Gutenberg 12.0, cambiare la formulazione riguardo il componente browser, e per aggiornare il termine di scadenza.

#fse-outreach-program, #fse-testing-call, #full-site-editing

Chiamata per il test del programma FSE #10: Alla festa dei modelli

Questa è la decima chiamata per il test  all’interno del Full Site Editing Outreach Program! Per sapere di più su questo programma di divulgazione, dai un’occhiata a  queste FAQ con utili dettagli. Per entrare nel vivo, vai su #fse-outreach-experiment in Make Slack per futuri annunci su nuovi test, articoli e molto altro ancora.

Ti ricordiamo anche che nel caso volessi suggerire un’idea per una chiamata per il test, ogni proposta è molto gradita e tutte le idee saranno valutate secondo le attuali priorità del progetto per stabilire quale ha più senso affrontare. Puoi anche condividere direttamente idee nel canale Slack  o via DM, scrivendo ad @annezazu

Panoramica della funzionalità

Full Site Editing è una collezione di funzionalità che rende possibile la modifica di sempre più elementi senza la conoscenza del codice, perciò è stato necessario creare dei nuovi blocchi per intervenire su più parti del tuo sito. Questi blocchi sono chiamati generalmente “blocchi tema”, dato che corrispondono a funzionalità che in precedenza erano esclusiva dei temi. Anche se una certa quantità di blocchi tema sono stati introdotti in WordPress 5.8, c’è sempre del lavoro da fare, incluso il rendere disponibili ancora più blocchi tema nelle prossime versioni!

Questo test si concentra nello spingere questi meravigliosi blocchi tema verso i propri limiti, per determinare meglio a cosa dare priorità e quali funzionalità restano da documentare. Per rendere l’esperienza un po’ più divertente e pratica, affronteremo questo test dal punto di vista della creazione di modelli per blog, con l’utilizzo di alcuni di questi blocchi. Se i risultati della tua creazione ti piacciono davvero tanto, ricorda che puoi anche registrarli sul tuo sito 🙂 

Per fare un po’ di ripasso, ecco una panoramica di tutti i blocchi tema pronti per il test, con una nota su quali di questi sono inclusi in WordPress 5.8 nel caso dovessi avere l’ispirazione di usarli sul tuo sito già da ora: 

  • Logo del sito: ti consente di visualizzare e modificare il logo del sito [incluso in 5.8].
  • Motto del sito: ti consente di visualizzare e modificare il motto del tuo sito [incluso in 5.8]. 
  • Titolo del sito: ti consente di visualizzare e modificare il titolo del tuo sito [incluso in 5.8]. 
  • Loop di query: ti consente di visualizzare articoli e pagine in vari formati [incluso in 5.8]. 
  • Titolo dell’articolo: visualizza il titolo dell’articolo the Post Title [incluso in 5.8]. 
  • Contenuto dell’articolo: visualizza il contenuti del tuo articolo [incluso in 5.8].
  • Data articolo: visualizza la data dell’articolo [incluso in 5.8].
  • Riassunto dell’articolo: visualizza il riassunto del tuo articolo [incluso in 5.8].
  • Immagine in evidenza dell’articolo: ti consente di visualizzare e modificare l’immagine in evidenza dell’articolo [incluso in 5.8].
  • Categorie articoli: visualizza le categorie di un articolo [incluso in 5.8].
  • Tag dell’articolo: visualizza i tag di un articolo [incluso in 5.8].
  • Accedi/Esci: visualizza i link per effettuare l’accesso o uscire [incluso in 5.8].
  • Elenco delle pagine: visualizza un elenco di tutte le pagine sul tuo sito [incluso in 5.8].
  • Parte del template: ti consente di visualizzare e modificare varie aree globali del tuo sito (header, footer, ecc). 
  • Commento all’articolo: visualizza un singolo commento.
  • Autore del commento all’articolo: visualizza l’autore di un commento. 
  • Contenuto del commento all’articolo: visualizza il contenuto di un commento.
  • Data del commento all’articolo: visualizza la data del commento. 
  • Commenti all’articolo: visualizza tutti i commenti. 
  • Conteggio dei commenti all’articolo: visualizza il conteggio dei commenti. 
  • Modulo dei commenti dell’articolo: visualizza il modulo dei commenti. 
  • Titolo dell’archivio: visualizza il titolo dell’archivio. 
  • Descrizione del termine: visualizza la descrizione di categorie, tag e tassonomie personalizzate quando si visualizza un archivio.

Ambiente di test

Anche se più avanti troverai maggiori informazioni per assicurarti di impostare tutto nel modo corretto, ecco gli aspetti chiave necessari per il tuo ambiente di test: 

In generale, assicurati di usare la versione più recente di ogni parte del setup e tieni presente che le versioni potrebbero essere cambiate da quando questo articolo è stato condiviso.

Passi per il test

Istruzioni per la configurazione: 

  1. Imposta un sito che stia usando la versione più recente di WordPress. È importante che non si tratti di un sito di produzione/live.
  2. Installa ed attiva il plugin Gutenberg da Plugin > Aggiungi nuovo. Se è già installato, assicurati che la versione in uso sia come minimo Gutenberg 11.6
  3. Installa il tema TT1 Blocks andando su Aspetto > Temi > Aggiungi Nuovo. Una volta installato, attiva il tema.
  4. Crea almeno otto articoli con due diverse categorie ed immagini in evidenza a tua scelta, assieme ad almeno quattro pagine da usare per il tuo menu. In alternativa, puoi scaricare ed importare il contenuto demo per Gutenberg creato apposta per questo test (apri il link e fai clic su “Download”) tramite l’importatore di WordPress che si trova in Strumenti > Importa. Puoi anche seguire questa lezione su come utilizzare contenuto demo.
  5. Vai nell’area di amministrazione del sito
  6. Ora dovresti vedere all’interno della navigazione un elemento chiamato “Editor del sito (beta)”. Se non lo vedi ancora nella tua barra laterale, non stai usando correttamente l’esperimento di Modifica del Sito

Istruzioni generali:

  1. Vai su Pagine > Aggiungi pagina e crea una nuova pagina. Assegnale il titolo che preferisci!
  2. Aggiungi il blocco Loop di query e seleziona qualunque modulo su cui vuoi iniziare a costruire. Puoi anche un blocco contenitore, ad esempio un blocco Colonne o un blocco Gruppo, ed aggiungi al suo interno il blocco Loop di query nel modo che preferisci.
  3. A questo punto, dai un tocco personale al modello usando quanti blocchi tema preferisci tra quelli descritti in precedenza. Ad esempio, potresti creare un modello pieno zeppo di commenti utilizzando i vari blocchi per i commenti o crearne uno particolarmente centrato sulle immagini, grazie ai nuovi miglioramenti del blocco Immagine in evidenza. Cerca di essere quanto più originale possibile e non sentire il vincolo di dover aggiungere i blocchi solo all’interno del Loop di query.

Se ti va di raccogliere la sfida e spingerti un po’ oltre con questo test, prova a creare il tuo modello da zero, crea più modelli, o ricrea quello che hanno fatto i designer di temi di Automattic negli esempi di seguito, aggiungendo qualcosa di tuo:

Cosa notare:

Se ti va, ricorda di condividere uno screenshot di quello che hai creato!

  • L’esperienza si è bloccata in qualche punto?
  • L’esperienza del salvataggio ha funzionato correttamente?
  • Hai trovato delle funzioni mancanti mentre creavi il tuo modello personalizzato per un blog? 
  • Cosa hai trovato particolarmente confuso o frustrante riguardo l’esperienza?
  • Cosa ti è piaciuto o hai apprezzato in modo particolare riguardo l’esperienza?
  • Cosa avrebbe potuto rendere più semplice questa esperienza?
  • Credi che quanto creato all’interno dell’editor del sito corrisponda a quello che vedi sul tuo sito?
  • Ha funzionato usando solo la tastiera?
  • Ha funzionato usando uno screen reader?

Lascia un feedback entro il 13 ottobre 2021

Lascia un feedback nei commenti di questo articolo. Se preferisci, puoi sempre creare delle issue in questo repo GitHub direttamente per Gutenberg. Se lasci un feedback in GitHub, commenta comunque di seguito indicando il link. Se vedi che qualcun altro ha già segnalato un problema, lascia comunque una nota qui di seguito riguardo la tua esperienza, sarà utile per fornire a chi sta lavorando per migliorare questa esperienza una panoramica più ampia su ciò che va migliorato.

Grazie a @priethor @sparklingrobots e @welcher per le revisioni su questo articolo e per avermi dato la fiducia per pubblicarlo.

#fse-outreach-program, #fse-testing-call, #full-site-editing

Esplorazione per il programma FSE: aiuto con il futuro passaggio tra temi a blocchi

Con l’avvento dei temi a blocchi all’interno dell’ecosistema di WordPress, sono all’orizzonte nuove possibilità, da un più semplice sviluppo di temi per sviluppatori e designer ad una più semplice realizzazione di siti per gli utenti. Ad ogni modo, anziché esaminare in astratto il solo valore dei temi a blocchi, è importante includere e considerare anche ciò che può essere fatto tra diversi temi a blocchi. Ad esempio, immagina un mondo in cui per creare un negozio sia possibile  prendere liberamente un modello di recensione prodotto da un tema, lo stile da un’altro, ed i template con cui visualizzare i prodotti da un tema specifico per l’e-commerce. O immagina di avere la possibilità di cambiare temi mantenendo tipografia e tavolozza colori preferita. Indipendentemente da tutto, è imperativo che l’esperienza sia affidabile, intuitiva e che possa essere ampliata, superando i limiti di ciò che era o non era possibile fare in passato. 

Come risultato, l’attenzione in questa esplorazione è concentrata innanzitutto su una prospettiva più a lungo termine del genere “sarebbe bello se”, iniziando dal guidarvi attraverso un procedimento elementare di passaggio tra temi, chiedendo poi ad ogni partecipante di pensare in modo creativo a ciò che vorrebbe accadesse. Vista la mancanza di procedure, questa non è esattamente una chiamata per il test, perciò ci concentreremo meno sul trovare dei bug (anche se le segnalazioni sono sempre incoraggiate) e più sul ragionare attentamente su cosa vorremmo accadesse o sul modo in cui vorremmo funzionasse. Lo scopo è raccogliere spunti utili che ci aiuteranno contribuendo al modo in cui progettiamo questa esperienza. 

Nota: per il momento ci stiamo volutamente concentrando sul passaggio tra temi a blocchi anziché, ad esempio, sul passaggio da classico a blocchi.

Esplora cos’è attualmente possibile.

I passi seguenti sono intesi come indicazioni generali ed hanno lo scopo di guidare l’impostazione iniziale di elementi relativi ad un tema a blocchi che si vorrebbe mantenere durante il passaggio tra temi. Non è richiesto fare delle prove con questi passi per quanto concerne questo test, dato che molti dei flussi non sono ancora stati costruiti. 

Se non hai il tempo di creare velocemente del contenuto, puoi importare questo contenuto demo (apri il link e seleziona “Download) creato espressamente per questo test tramite l’importatore WordPress disponibile sotto Strumenti >  Importa. Puoi anche seguire questa lezione su come usare il contenuto demo.

  1. Crea un sito di test. Non usare un sito di produzione/live. Puoi seguire queste istruzioni per impostare un’installazione locale o usare uno strumento come questo per impostare un sito di sviluppo
  2. Installa ed attiva la versione più recente di  Gutenberg
  3. Installa ed attiva un tema a blocchi scegliendo fra le opzioni elencate nella directory dei temi
  4. Crea un template personalizzato sotto Aspetto > Template > Aggiungi Nuovo. 
  5. Crea una parte del template personalizzata sotto Aspetto > Parti del Template > Aggiungi Nuova. 
  6. Apri l’Editor del sito e, usando l’interfaccia utente dei Global Styles, scegli alcuni stili di blocco personalizzati e stili predefiniti generali. Salva tutte le modifiche. 
  7. Ora vai su Aspetto > Temi e cambia tema. 
  8. Verifica Editor del sito, Template, e Parti del Template. 

Bonus: Prova ad importare ed esportare contenuti da uno dei tuoi siti attuali ad un sito di test, in modo da rendere il sito di test più realistico e pertinente, anche se il sito non sta usando un tema a blocchi. A questo punto, passa a qualunque altro tema, che sia a blocchi o meno. Questo serve puramente a farti entrare nell’ottica di pensare di più a ciò che vorresti tenere, anche se ci stiamo concentrando in modo specifico sui temi a blocchi. 

Descrivi ciò che vorresti vedere

Commenta di seguito dopo aver riflettuto sulle seguenti domande. Ricorda di condividere ciò che vorresti idealmente vedere, piuttosto che concentrarti su quanto è disponibile in questo momento. Rispondi ad una domanda, rispondi a tutte o non rispondere affatto! Servono solo per farti entrare nell’ordine delle idee, piuttosto che essere delle caselle da spuntare: 

  • Cosa vorresti essere in grado di fare quando passi da un tema all’altro?
  • Quali parti del tema a blocchi ti aspetti di essere in grado di mantenere quando passi da un tema all’altro?
  • Che genere di messaggi di conferma vorresti vedere?
  • Condividi un momento in cui il passaggio ad un altro tema ha fatto succedere qualcosa di inaspettato.
  • Quando passi da un tema all’altro sul tuo sito, puoi condividere il tuo procedimento?
  • Se volessi passare ad un nuovo tema oggi, dove andresti ed in quali posti ti aspetteresti di essere in grado di fare questa operazione?
  • Quali sono alcune delle ragioni che hai avuto per voler passare ad un nuovo tema?
  • C’è dell’altro? Pensa in grande!

Condividi il tuo feedback entro il 29 Settembre 2021

Come sempre, grazie per la tua partecipazione in questo esercizio. Se c’è qualcosa che ti impedisce di partecipare, faccelo sapere su #fse-outreach-experiment, nei commenti a questo articolo, o tramite DM in Slack ad @annezazu (non sono io!). Tieni presente che non tutto ciò che verrà condiviso sarà implementato, data la natura di questa esplorazione, ma sappi che le tue idee serviranno a dare forma a ciò che sarà possibile man mano che andiamo avanti.

Grazie a @poena @kellychoffman @priethor @daisyo per la revisione!

#block-themes, #fse-exploration, #fse-outreach-program, #full-site-editing

Chiamata per il test del programma FSE #9: Occuparsi di Header per delle Università

Questa è la nona chiamata per il test all’interno del Full Site Editing Outreach Program! Per sapere di più su questo programma di divulgazione, dai un’occhiata a  queste FAQ con utili dettagli. Per entrare nel vivo, vai su #fse-outreach-experiment in Make Slack per futuri annunci di test, articoli utili ed altro ancora.

Rispetto alle precedenti chiamate per il test, questa è ancora più orientata alla comunità, dopo il suggerimento di @blake di fare una chiamata che avesse come tema l’Università. Se vuoi suggerire un’idea per una chiamata per il test, sappi che è più che benvenuta e che tutte le idee saranno considerate in relazione alle attuali priorità del progetto, in modo da stabilire quali abbia più senso intraprendere. Puoi condividere idee direttamente nel canale slack o tramite DM ad @annezazu

Panoramica delle funzioni

Per basare questo test su un esempio della vita di tutti i giorni, torneremo a scuola come amministratori e creeremo un header personalizzato per dare il benvenuto a studenti, genitori ed insegnanti alla nostra ipotetica università. Come ispirazione, dai un’occhiata al campione di siti universitari di seguito o cercane qualcuno vicino a te! Dato che questo test si concentra sul costruire la porzione dell’header, l’attenzione è puntata su questo aspetto e sul prendere nota di cosa è stato fatto su ogni sito: 

https://www.kyoto-u.ac.jp/en

https://www.ni.ac.rs/en/student-info

https://engineering.asu.edu/

Come puoi immaginare, questo test ci consentirà di esplorare più in profondità il blocco Navigazione. Per rinfrescare la memoria, è un nuovo, potente blocco che fornisce l’abilità di modificare il menu di navigazione di un sito, sia in termini di struttura che di design. Per aiutarci a prepararlo per l’inclusione in una futura versione di WordPress, il test ha lo scopo di esplorare i limiti di cosa può fare questo blocco.

In modo simile ai test precedenti, se scegli di sbizzarrirti con la creatività, condividi uno screenshot nei tuoi commenti, in modo che possiamo complimentarci per quello che hai creato. Come ispirazione, ecco il mio esempio di seguito, con più livelli di elementi sottomenu visualizzati:

Ambiente di test

Anche se più avanti troverai maggiori informazioni per assicurarti di impostare tutto nel modo corretto, ecco gli aspetti chiave necessari per il tuo ambiente di test: 

In generale, assicurati di usare la versione più recente di ogni parte del setup e tieni presente che le versioni potrebbero essere cambiate da quando questo articolo è stato condiviso.

Problemi noti

Durante la preparazione di questa call per il test, sono saltati fuori alcuni problemi in cui potresti imbatterti durante la prova. Sappi che sono già stati segnalati. Ecco una lista non esaustiva di quelli più importanti:

Passi del test per principianti

Questa sezione è indirizzata a chi vuole seguire dei passi specifici per creare un header e potrebbe non avere molto altro tempo per spingersi un po’ oltre con questo test. 

Anche se questa call per il test è focalizzata sulla prova di una funzionalità specifica, è probabile che troverai degli altri bug mentre utilizzi una funzione beta come questa! La segnalazione di tutti i bug che troverai è ben accetta nel rapporto che invierai riguardo il tuo test, anche se non sono direttamente riconducibili alla funzionalità di cui hai fatto il test.

Crea la struttura (parte del template, colonne, etc.)

  1. Naviga fino alla vista “Site Editor (beta)”. Questo  aprirà automaticamente l’editor del template che fa funzionare la tua home page.
  2. Dopo aver aperto la tua home page, rimuovi il blocco Navigazione che trovi all’interno della parte del template Header. Questo serve a reimpostare l’header in modo da poter aggiungerci dei contenuti più avanti. 
  3. Seleziona il blocco Colonne genitore e, usando le impostazioni del blocco nella barra laterale, cambia il numero di colonne da 2 a 3.
  4. Torna al blocco colonne e, usando le impostazioni del blocco nella barra degli strumenti, assicurati che sia impostato su larghezza piena.

Costruisci il branding del sito

  1. Nella prima colonna, inserisci il blocco Logo del sito e carica/usa un logo per il sito. Puoi usare questo logo gratuito di logodust.com se vuoi.
  2. Ora personalizza i blocchi titolo del sito, motto del sito e logo del sito in base ai tuoi gusti (cambia font, colore, allineamento, ecc.)
  3. Nella seconda colonna, inserisci un blocco Pulsanti per aggiungere un avviso a proposito di COVID, collegandolo all’articolo sull’aggiornamento COVID di agosto. Puoi fare questo cercando il titolo dell’articolo. Se non hai ancora importato il contenuto demo necessario, fallo usando questo file di esportazione (apri il link e fai clic sulla voce “Download”). 

Crea un semplice menu per gli elementi principali 

  1. Nella terza colonna, inserisci un blocco navigazione e seleziona l’opzione “inizia vuoto”. 
  2. A questo punto, usa il blocco Link pagina per aggiungere le seguenti pagine dal contenuto importato: Contact, Directions, Make a Donation. Per fare questo, basta iniziare a scrivere il titolo di ogni pagina. A questo punto, noterai probabilmente il bug relativo alla spaziatura che prevediamo di risolvere nella versione 11.3 di Gutenberg. 
  3. Rinomina la voce di menu Make a Donation in Donate per renderla più breve, semplicemente modificando il testo del blocco Link pagina.  
  4. Per completare il menu, inserisci il blocco Ricerca e, usando le impostazioni nella barra laterale, personalizzalo in base ai tuoi gusti (scegli colore di sfondo, colore del test, larghezza, ecc.).
  5. Una volta che le voci del menu sono impostate, seleziona tutto il blocco Navigazione ancora una volta e, nelle impostazioni della barra laterale, sotto “Impostazioni di visualizzazione” attiva l’opzione Abilita il menu responsive. A questo punto puoi, se vuoi puoi anche personalizzare gli stili del blocco.

Creare un menu più complesso per voci specifiche

  1. Seleziona tutto il blocco Colonne che contiene le tue tre colonne (questo è uno dei casi in cui potresti trovare utile la Visualizzazione in modalità elenco). Usando le opzioni aggiuntive all’interno del menu, seleziona “Inserisci prima” per aggiungere un altro blocco. 
  2. Aggiungi un altro blocco Colonne e seleziona l’opzione 30/70.
  3. Da qui, seleziona tutto il blocco Colonne ancora una volta e, usando le impostazioni nella barra degli strumenti del blocco, assicurati che sia impostato su Larghezza piena.
  4. Aggiungi un blocco Navigazione alla colonna più ampia, con larghezza 70%, e seleziona l’opzione “Inizia vuoto”. 
  5. A questo punto, utilizza il blocco Link pagina per inserire le seguenti pagine dal contenuto importato: About, Admissions, Student Life, Research, and News. Per fare questo, puoi iniziare a scrivere il titolo di ogni pagina. 
  6. Una volta che gli elementi principali del menu sono sistemati, seleziona tutto il blocco Navigazione ancora una volta e, nelle impostazioni della barra laterale, sotto “Impostazioni di visualizzazione” attiva l’opzione Abilita il menu responsive.
  7. Da qui, aggiungi le voci dei sottomenu ad About, Admissions, Student Life, e Research. Nel caso ti servisse un aiuto, ecco uno screenshot dell’icona per aggiungere voci sottomenu. 
    1. About dovrebbe avere le seguenti voci come sottomenu: Distinguished Alumni,  Diversity and Inclusion, Faculty, History, Leadership.
    2. Admissions dovrebbe avere le seguenti voci come sottomenu: Career Paths, Undergraduate Graduate Admissions, Scholarship & Financial Aid, Tuition. 
    3. Research dovrebbe avere le seguenti voci come sottomenu: Awards & Honors, Partnerships, Undergraduate Research, Graduate Research. 
    4. Student Life dovrebbe avere le seguenti voci come sottomenu: Athletics, Tutoring Services, FAQs, Study Abroad Opportunities, Tutoring, Services. 
  8. A questo punto, aggiungi voci sottomenu sotto Admissions > Career: Business, Design, Technology. 
  9. Una volta che le voci sottomenu sono state aggiunte, riordina e rinomina le varie voci sottomenu in base alle tue preferenze. Puoi riordinarle usando l’opzione che trovi all’interno del blocco Navigazione quando selezioni tutto il blocco Navigazione, come mostrato in questa GIF
  10. Se vuoi aggiungere delle altre pagine che ancora non esistono, puoi farlo scrivendo un titolo che non esiste ancora all’interno del tuo sito. Facendo questo, vedrai un’opzione per creare la bozza di una pagina. Fai questa operazione per almeno una voce di menu. Ricordati di divertirti e creare qualcosa che sia davvero a tema Università!
  11. A questo punto, personalizza tutto il blocco Navigazione come preferisci (cambia allineamento, colore, dimensione dei font, ecc.). Ricorda che per gli elementi sottomenu puoi usare le impostazioni colore in sovraimpressione per impostare il colore che preferisci.

Salva il tuo lavoro e continua a personalizzare

  1. Fai clic su “Salva” per salvare le tue modifiche e vedere il tuo sito sul frontend. Nota eventuali differenze tra quello che vedi nell’editor e quello che vedi sul frontend. Se hai pagine che sono ancora bozze, assicurati di pubblicarle in modo che siano visibili nel menu. 
  2. Prova a vedere il tuo sito su un dispositivo mobile e verifica se i menu vengono visualizzati in modo responsive con un menu hamburger.
  3. A questo punto, continua a personalizzare in base alle tue preferenze, cambiando allineamento, colore, dimensione dei font, eliminando, rinominando, riordinando delle voci ed altro ancora. Puoi anche inserire dei blocchi aggiuntivi sia al blocco Navigazione, incluso i blocchi Spazio vuoto ed Icone social.

Passi del test avanzati

Questa sezione è indirizzata a chi ha il tempo per spingersi oltre con il test ed è a proprio agio nell’avventurarsi nell’editor del sito senza molte indicazioni.

I passi per questa sezione sono semplici: trova l’header di un’università e prova a ricrearlo tutto o in parte. Puoi benissimo continuare ad usare TT1 Blocks o utilizzare il tema a blocchi che preferisci (prendi nota se usi un tema diverso). Puoi usare le università elencate in precedenza o puoi trovarne di tue. Quando lasci un commento, condividi uno screenshot di quello che stavi cercando di replicare ed uno screenshot di quello che è stato possibile creare. È molto utile vedere cosa vorrebbe creare chi partecipa, quindi non esitare a condividere i diversi design che vedi. 

Cosa notare:

Se ti va, ricorda di condividere uno screenshot di quello che hai creato!

  • L’esperienza si è bloccata in qualche punto?
  • L’esperienza del salvataggio ha funzionato correttamente?
  • Hai trovato delle funzioni mancanti mentre creavi l’header? Fornisci informazioni più specifiche possibile, specialmente se hai seguiti i passi avanzati
  • Cosa hai trovato particolarmente confuso o frustrante riguardo l’esperienza?
  • Cosa ti è piaciuto o hai apprezzato in modo particolare riguardo l’esperienza?
  • Credi che quanto creato all’interno dell’editor del sito corrisponda a quello che vedi sul tuo sito?
  • Come ti è sembrato il funzionamento del blocco Navigazione quando visualizzato su formati di schermi più piccoli?
  • Ha funzionato usando solo la tastiera?
  • Ha funzionato usando uno screen reader?
  • Se vuoi, prova ad analizzare il tuo sito di test con uno strumento tipohttps://wave.webaim.org o https://www.accessify.com per vedere come si comporta. 

Lascia un feedback entro il 1 settembre 2021

Lascia un feedback nei commenti di questo articolo. Se preferisci, puoi sempre creare delle issue in questo repo GitHub direttamente per Gutenberg ed in questo repo GitHub per TT1 Blocks. Anche se lasci un feedback in GitHub, commenta comunque di seguito indicando il link. Se vedi che qualcun altro ha già segnalato un problema, lascia comunque una nota qui di seguito riguardo la tua esperienza, sarà utile per fornire a chi sta lavorando per migliorare questa esperienza una panoramica più ampia su ciò che va migliorato.

#fse-outreach-experiment, #fse-outreach-program, #fse-testing-call, #full-site-editing

Chiamata per il test del programma FSE #8: Fiorisci con Theme.json

Un ringraziamento a @daisyo@jffng per l’incredibile quantità di aiuto nello scrivere e perfezionare questa chiamata per i test. 

Nota importante: Rispetto alle precedenti chiamate per i test del programma FSE Outreach, questa è intenzionalmente rivolta più ad un pubblico di sviluppatori, piuttosto che agli utenti finali o a chi utilizza site builder, con lo scopo di raccogliere feedback che abbia un grande impatto su theme.json, un nuovo strumento per gli extender. Potete leggere di più su cosa aspettarvi dalle nostre prossime iniziative qui

Panoramica delle funzionalità

Volendo definirlo in modo generale, theme.json è un file di configurazione usato per abilitare o disabilitare funzionalità ed impostare stili di default sia per un sito che per dei blocchi. Piuttosto che avere a che fare con una miriade di indicatori di supporto dei temi o metodi alternativi, theme.json fornisce un modo consolidato e canonico di gestire tutto. Queste impostazioni includono opzioni come:

  • Quali opzioni di personalizzazione dovrebbero essere rese disponibili o nascoste all’utente.
  • Quali sono colori, font predefiniti, ecc., disponibili all’utente
  • Definire il layout di default dell’editor (larghezza e allineamenti disponibili).

Questo file di configurazione è una grossa parte di ciò che rende i temi basati sui blocchi così potenti, dato che consente un controllo più particolareggiato ed introduce il primo passo nella “gestione degli stili” per future versioni di WordPress. Ecco alcuni dei principali benefici nell’usare questo nuovo meccanismo: 

  • Consente ai temi di fornire impostazioni per singoli blocchi, cosa che non era possibile in precedenza, dato che add_theme_support è rivolto alle impostazioni per l’intero editor. 
  • I temi che utilizzano theme.json avranno automaticamente classi e proprietà css personalizzate accodate per le impostazioni predefinite che dichiarano, anziché doverle gestire separatamente. Inoltre, questo significa che le traduzioni dei nomi delle impostazioni predefinite sono anche gestite per conto loro! 
  • Theme.json coordinerà core, tema e stili dell’utente in un modo che riduce la quantità di CSS che è necessario includere ed aiutare a risolvere problemi di specificità.

Anche se i temi basati sui blocchi non funzioneranno su WordPress 5.8 senza il plugin Gutenberg, dato che alcuni temi basati sui blocchi non erano completamente pronti per essere pubblicati, questa è ancora una importante funzionalità in arrivo nella 5.8 che ha necessità di test ed esplorazione. Se avete avuto delle curiosità sul mondo dei temi basati sui blocchi o avete iniziato a costruire il vostro, questa chiamata per i test è fatta per voi e dovrebbe aiutarvi a continuare ad esplorare cosa è possibile fare con theme.json dandovi allo stesso tempo la possibilità di condividere cos’altro vorreste vedere.

Potete leggere di più riguardo questa funzionalità nella documentazione che trovate qui

Passi del test per principianti

Questa sezione è rivolta a chi vuole avere un’idea di ciò che theme.json può controllare e quale aspetto avrà il risultato.

  1. Vai su https://gutenberg-theme.xyz/. Questo è uno strumento che può aiutarti a generare la sezione delle impostazioni del file theme.json.
  2. Da qui, prova ad attivare o disattivare varie funzioni supportate dal tema. Questo ti aiuterà ad esplorare alcune delle impostazioni che è possibile controllare tramite theme.json. Ad esempio, puoi attivare i controlli relativi a colori personalizzati o link personalizzati. Nota come il codice generato nel browser cambia in base alla tua selezione. 
  3. Usa il bottone + vicino a Palette, Gradients o Font Sizes per esplorare l’aggiunta di personalizzazioni. Ricorda che puoi modificare sia lo slug che delle variabili specifiche quali nome del colore o dimensione del font.
  4. Aggiungi alcune personalizzazioni e verifica quanto viene generato! Se vuoi spingerti un po’ oltre ed usare quello che hai creato, dai un’occhiata a questi passi intermedi. 

Passi del test per utenti intermedi

Questa sezione è rivolta a chi desidera andare più a fondo su theme.json scrivendo il proprio file ed esplorando ciò che varie impostazioni possono controllare. 

Nota: questo si concentra principalmente su funzioni supportate dal tema ed impostazioni predefinite per i blocchi nella sezione impostazioni di theme.json anziché in Global Styles.

Impostare il tuo ambiente di test

  • Crea una nuova installazione di WordPress.
  • Installa ed attiva il plugin Gutenberg accertandoti di utilizzare l’ultima versione (10.9.0 mentre scriviamo).
  • Scarica ed installa TT1 Blocks dalla Directory dei temi
  • Naviga fino alla directory del tema TT1 Blocks ed apri il file theme.json file in un editor di testo o in un IDE.

Come regola generale, usa la versione più recente di tutte le parti che compongono la tua installazione e ricorda che le versioni potrebbero essere cambiate da quando questo articolo è stato condiviso.

Layout

  1. Crea un nuovo articolo.
  2. Aggiungi un blocco copertina con uno sfondo a tinta unita ed alcune linee di contenuto in un blocco paragrafo all’interno dell’articolo.
  3. Aggiungi un altro blocco copertina con uno sfondo a tinta unita ed alcune linee di contenuto in un blocco paragrafo all’interno dell’articolo. Imposta questo blocco come “larghezza ampia”.
  4. Aggiungi un terzo blocco copertina con uno sfondo a tinta unita ed alcune linee di contenuto all’interno dell’articolo ed imposta questo blocco come “larghezza piena”.
  5. Pubblica l’articolo.
  6. Carica l’articolo sul front end e fai caso alla larghezza dei blocchi copertina.
  7. Cambia il valore contentSize con un valore pixel diverso nella sezione Layout di theme.json.
  8. Cambia il valore wideSize con un valore pixel diverso nella sezione Layout di theme.json.
  9. Carica la visualizzazione di modifica dell’articolo creato in precedenza e conferma che le nuove larghezze ora vengono corrispondano nell’editor.
  10. Carica l’articolo sul frontend e conferma che le nuove larghezze corrispondano sul frontend del sito.
  11. Punti bonus: Prova ad impostare i valori di larghezza utilizzando qualcosa diverso da “px”, ad esempio “em”, “rem”, “vh”, “vw”, or “%”

Tipografia

  1. Imposta come true le seguenti opzioni di tipografia in theme.json:
  • customFontWeight (Blocco Titolo)
  • customFontSize (Blocco Paragrafo)
  • customLineHeight (Blocco Paragrafo)
  • dropCap (Blocco Paragrafo)
  • Verifica la visibilità delle impostazioni di tipografia in un blocco paragrafo (dimensione font, peso del font weight, altezza della linea and capolettera)
  • Verifica la visibilità delle impostazioni di tipigrafia in un blocco Titolo (dimensione font, peso del font weight, altezza della linea)
  • Prova che ognuna delle impostazioni venga applicata al blocco sul frontend
  • Cambia le impostazioni di tipografia come false in theme.json
  • Conferma che ognuna delle impostazioni personalizzate di tipografia nel blocco paragrafo non siano più presenti nell’editor a blocchi (Nota che le impostazioni di tipografia applicate precedentemente potrebbero essere ancora valide per i blocchi esistenti)
  • Crediti aggiuntivi: Aggiungi una o più famiglie di font e dimensioni di font alla sezione tipografia del file theme.json. Verifica le tue famiglie di font e dimensioni personalizzate usando un blocco pulsante. 
  • Bordi

    1. Imposta come true le seguenti impostazioni dei bordi su true in theme.json:
    • “customColor”: true
    • “customRadius”: true
    • “customStyle”: true
    • “customWidth”: true
  • Crea un blocco gruppo che contenga un blocco paragrafo con varie righe di testo. 
  • Verifica la visibilità delle impostazioni dei bordi in un blocco gruppo (stile, larghezza, raggio, colore personalizzato).
  • Verifica che le impostazioni siano applicate al blocco sul frontend.
  • Imposta come false le impostazioni dei bordi in theme.json.
  • Conferma che le impostazioni dei bordi nel blocco gruppo non siano più presenti nell’editor a blocchi.
  • Colore

    1. Imposta come true le seguenti impostazioni per  custom e customGradient in theme.json:
    • “custom”: true
    • “customGradient”: true
    • “link”: true
  • Aggiungi un blocco copertina con uno sfondo a gradiente personalizzato ed alcune righe di contenuto in un blocco paragrafo all’interno dell’articolo
  • Aggiungi un link al blocco paragrafo ed assegna un colore personalizzato al colore del link.
  • Aggiungi un altro blocco copertina con un’immagine di sfondo ed alcune righe di contenuto in un blocco paragrafo all’interno del post. Assegna allo sfondo della copertina uno degli effetti bicromia predefiniti.
  • Cambia i colori di bicromia dell’immagine di sfondo in modo che usino colori personalizzati per le impostazioni di ombre e alte luci dell’effetto bicromia.
  • Crediti aggiuntivi: Aggiungi uno o più colori addizionali alla tavolozza dei colori ed alle impostazioni predefinite bicromia o gradiente. Per maggiori informazioni a proposito dei gradienti CSS dai un’occhiata a queste risorse di CSS Tricks e CSS Gradient.
  • Nel caso possa aiutare, ecco un esempio di @daisyo del genere di risultato che dovresti ottenere alla fine.

    Passi del test (molto) avanzati

    Questa sezione è rivolta a chi ha esperienze di sviluppo di temi e vuole creare un tema basato su blocchi più robusto tramite l’utilizzo di theme.json. Questa è una cosa per tutti! 

    Se ti senti più a tuo agio con i temi basati sui blocchi ed hai del tempo per esplorare in profondità theme.json, prova a replicare un tema classico. Ecco due opzioni che dovrebbe essere interessante esplorare, ma ricorda che qualsiasi tema di default dovrebbe funzionare bene:

    Mentre provi a fare questo, prendi nota di quali sono i limiti attuali, quali sono le cose più difficili da fare, e quello che invece è sorprendentemente facile! Condividi le tue impressioni nei commenti di seguito, in modo che possiamo imparare dalla tua esperienza. Questa richiesta è volutamente aperta ed avanzata, per cui non preoccuparti se non ti senti di raccogliere la sfida. Se vuoi invece seguire qualcun altro che esplora il modo in cui fare questo, segui il video dell’esperimento di @mkaz su come imparare a creare un tema basato su blocchi.

    Cosa notare:

    Queste domande sono specificamente per le sezioni intermedia ed avanzata: 

    • Al passaggio del mouse, i colori aggiunti tramite il file theme.json vengono mostrati assieme ai nomi assegnati sulla tavolozza dei colori per i vari blocchi?
    • Le dimensioni dei font aggiunte tramite il file theme.json file sono visualizzate assieme a nomi e dimensioni assegnate nei menu a discesa per la selezione della dimensione dei font nei blocchi?
    • I colori e le dimensioni dei font sono visualizzate correttamente quando utilizzate assieme ai blocchi nell’editor? 
    • I colori e le dimensioni dei font sono visualizzate correttamente quando utilizzate assieme ai blocchi sul frontend?
    • Cosa hai trovato particolarmente confuso o frustrante riguardo l’esperienza?
    • Cosa ti è piaciuto o hai apprezzato in modo particolare riguardo l’esperienza? 

    Lascia un feedback entro il 14 Luglio

    Lascia un feedback (domande, commenti, perplessità) nei commenti di questo articolo e prendi nota della sezione che hai seguito. Se preferisci, puoi sempre creare delle issue in questo repo GitHub direttamente per Gutenberg, ma è improbabile che tu debba farlo per questo test. In ogni caso, Se lasci un feedback in GitHub, commenta di seguito indicando il link. 

    Unisciti alla nostra chiacchierata sui test di theme.json il 7 luglio.

    Per aiutare chi vorrebbe esplorare in gruppo questo test e theme.json, @daisyolsen sarà la moderatrice di una chiacchierata informale specifica su questo esercizio. Se non hai mai partecipato ad una delle nostre chiacchierate in corridoio, puoi leggere di più sull’argomento qui. In fin dei conti, sono pensate per essere delle occasioni di collaborazione informale che fanno incontrare chi ha interessi simili. 

    Speriamo di vederti lì. 

    #fse-outreach-program, #fse-testing-call, #full-site-editing

    Chiamata per il test del programma FSE #7: Portfolio di un certo livello

    Questa è la settima call per i test come parte del Full Site Editing Outreach Program! Come detto nella sesta call per i test, se non hai potuto ancora partecipare, questa è un’ottima occasione per farlo, in vista della 5.8.

    Per maggiori informazioni riguardo questo programma sperimentale, dai un’occhiata a queste FAQ per ulteriori dettagli utili. Se ti voi unire a noi, vieni a trovarci su #fse-outreach-experiment in Make Slack per gli annunci di test futuri, articoli utili ed altro ancora.

    Panoramica della funzionalità

    Come promemoria, la modalità di modifica del Template è una caratteristica del Full Site Editing che sblocca la possibilità di passare tra la modifica del contenuto di una singola pagina o articolo e la modifica del template che quella singola pagina o articolo usano. Con questa funzionalità puoi creare un nuovo template, modificare quelli esistenti, e scegliere quale template usare per pagine ed articoli. Puoi scoprire di più riguardo questa funzionalità in questo video:

    https://www.youtube.com/watch?v=Z571V_jlD-o

    Per basare questo test su un esempio plausibile nel mondo reale, costruiremo una pagina portfolio che mostrerà il vostro ipotetico fantastico lavoro. Usando il contenuto demo, potrete esprimere l’architetto che è in voi, mostrando viste di posti di fantasia, come il Block Plugin Harbor ed il Gutenberg Parkour Space. Condividete uno screenshot nel vostro commento, in modo che possiamo celebrare quanto avete creato. Come ispirazione, ecco il mio esempio ed ecco dei fantastici esempi creati da alcuni designer con l’uso di Gutenberg.

    Nota: Rispetto alla sesta call per i test, questa call è intenzionalmente più aperta a livello di configurazione per fare in modo che voi che fate i test possiate spingere questa funzionalità verso i propri limiti. Buon divertimento!

    Ambiente di test

    Anche se più avanti troverai maggiori informazioni per assicurarti di impostare tutto nel modo corretto, ecco gli aspetti chiave necessari per il tuo ambiente di test:

    In generale, usa l’ultima versione di ognuna delle parti dell’impostazione raccomandata e tieni a mente che le versioni potrebbero essere cambiate da quando questo articolo è stato condiviso.

    Flusso del test

    Anche se questa call per il test è focalizzata sulla prova di una funzionalità specifica, è probabile che troverai degli altri bug mentre utilizzi una funzione beta come questa! La segnalazione di tutti i bug che troverai è ben accetta nel rapporto che invierai riguardo il tuo test, anche se non sono direttamente riconducibili alla funzionalità di cui hai fatto il test.

    Problemi noti:

    Durante la preparazione di questa call per il test, sono saltati fuori alcuni problemi in cui potresti imbatterti durante la prova. Sappi che sono già stati segnalati. Ecco una lista non esaustiva di quelli più seri.

    Ci si può aspettare che i problemi noti possano apparire in questa fase dello sviluppo per qualcosa che è attivamente oggetto di varie iterazioni!

    Istruzioni per la configurazione: 

    1. Imposta un sito che stia usando la versione più recente di WordPress. È importante che non si tratti di un sito di produzione/live.
    2. Installa il tema TT1 Blocks andando su Aspetto > Temi > Aggiungi Nuovo. Una volta installato, attiva il tema.
    3. Crea sei articoli con due diverse categorie ed immagini in evidenza a tua scelta, assieme ad almeno quattro pagine da usare per il tuo menu. In alternativa, puoi scaricare ed importare il contenuto demo di Gutenberg creato apposta per questo test tramite l’importatore di WordPress che si trova in Strumenti > Importa
    4. Vai nell’area di amministrazione del sito
    5. Installa ed attiva il plugin Gutenberg da Plugin > Aggiungi nuovo. Se è già installato, assicurati che la versione in uso sia come minimo Gutenberg 10.7.1
    6. Ora dovresti vedere all’interno della navigazione un elemento chiamato “Editor del sito (beta)”. Se non lo vedi ancora nella tua barra laterale, non stai usando correttamente l’esperimento di Modifica del Sito. Non fare clic su questa voce, dato che per questo test non stiamo esplorando l’editor del sito!

    Setting up your portfolio page

    1. In Pagine, seleziona “Aggiungi pagina” e dalle il titolo “Portfolio”.
    2. Nel contenuto della pagina, aggiungi un blocco Query e scegli qualunque modello preferisci usare, o usa l’inserter per aggiungere un modello di Query. Ecco un breve video che mostra come inserire un modello nel caso dovessi bloccarti.
    3. Quando il modello è stato inserito, puoi aprire le impostazioni del blocco e, all’interno di Impostazioni disattivare “Eredita query da URL”. A questo punto, dovresti vedere delle opzioni per personalizzare quali articoli include questo blocco Query. Il contenuto demo include le seguenti categorie da usare: Portfolio, Parks, Buildings.
    4. Personalizza il blocco Query come preferisci! Questo potrebbe includere la creazione di colonne in cui inserire diversi blocchi Query per visualizzare diverse categorie di articoli o blocchi aggiuntivi, ad esempio Autore del post. Nel caso dovessi bloccarti qui, passa alla sezione “Istruzioni e idee per la personalizzazione” per un aiuto.

    Creare e personalizzare un nuovo template

    1. Nella barra laterale, apri le impostazioni e seleziona le impostazioni della pagina (dovresti vedere Pagina e Blocco). Seleziona “Nuovo” all’interno della sezione Template per creare un nuovo template. Ecco un breve video nel caso in cui dovessi bloccarti.
    2. Dai al nuovo template il titolo “Portfolio”.
    3. A questo punto, ti troverai nella modalità di Modifica del Template e, all’interno dell’header, vedrai un blocco Titolo sito, Motto del sito ed un blocco separatore. Puoi tenere questi blocchi, covertirli in Colonne o rimuoverli del tutto.
    4. Aggiungi un blocco Navigazione all’header e seleziona l’opzione “Inizia vuoto”. A questo punto, aggiungi tutte le pagine che hai creato al menu per impostare la struttura. Se hai usato il contenuto demo, ecco i nomi delle pagine, in modo che tu possa cercarle: About, Contact, Resume, Partners, Influences.
    5. A questo punto, puoi personalizzare header, footer ed altro ancora a tuo piacimento. Se ti blocchi in questo punto, passa alla sezione “Istruzioni e idee per la personalizzazione” per un aiuto. Usa la creatività e costruisci qualcosa di tuo!
    6. Salva le tue modifiche e visualizza la tua pagina Portfolio.

    Istruzioni e idee per la personalizzazione:

    Mentre il test precedente era stato pensato per guidarti attraverso i passi specifici per la creazione di un template personalizzato, questo test è stato concepito per consentirti di esplorare le personalizzazioni che hai in mente. Questo dovrebbe fornire un test molto più ampio e dal risultato finale aperto, che dovrebbe aiutarti ad esplorare i confini dell’esperienza e, idealmente, trovare sia bug che richieste di miglioramento! Visto che ci sono due punti di personalizzazione in questo test, le seguenti istruzioni sono state organizzate in modo da coprire entrambi. Ricorda che quanto condiviso di seguito è solo l’inizio delle personalizzazioni con cui puoi sperimentare!

    Idee per la pagina Portfolio:

    Idee per il Template Portfolio:

    Cosa notare:

    Se ti va, ricorda di condividere uno screenshot di quello che hai creato!

    • L’esperienza si è bloccata in qualche punto?
    • L’esperienza del salvataggio ha funzionato correttamente?
    • Hai trovato delle funzioni mancanti?
    • Cosa hai trovato particolarmente confuso o frustrante riguardo l’esperienza?
    • Cosa ti è piaciuto o hai apprezzato in modo particolare riguardo l’esperienza?
    • Credi che quanto creato all’interno della modalità di modifica del template corrisponda a quello che vedi sul tuo sito?
    • Ha funzionato usando solo la tastiera?
    • Ha funzionato usando uno screen reader?

    Lascia un feedback entro il 16 giugno 2021

    Lascia un feedback nei commenti di questo articolo. Se preferisci, puoi sempre creare delle issue in questo repo GitHub direttamente per Gutenberg ed in questo repo GitHub per TT1 Blocks. Anche se lasci un feedback in GitHub, commenta comunque di seguito indicando il link. Se vedi che qualcun altro ha già segnalato un problema, lascia comunque una nota qui di seguito riguardo la tua esperienza, sarà utile per fornire a chi sta lavorando per migliorare questa esperienza una panoramica più ampia su ciò che va migliorato.

    #core-editor, #fse-outreach-program, #fse-testing-call, #full-site-editing, #gutenberg

    Chiamata per il test del programma FSE #6: Un atterraggio perfetto (sulla pagina)

    Questo articolo riguarda l’annuncio della sesta call per i test come parte del Full Site Editing Outreach Program, un passo davvero importante sulla strada verso la 5.8! Se non hai potuto ancora partecipare, questo è un’ottima occasione per farlo. Se ti piace l’idea di contribuire agli sforzi futuri, dai un’occhiata ai prossimi appuntamenti nel calendario del programma

    Per maggiori informazioni riguardo questo programma sperimentale, dai un’occhiata a queste FAQ per ulteriori utili dettagli. Se vuoi proprio divertirti, vieni a trovarci su #fse-outreach-experiment in Make Slack per gli annunci di test futuri, articoli utili ed altro che verrà condiviso attraverso questo canale.

    Panoramica della funzionalità

    È cambiato molto da quando la prima call per i test si era concentrata sulla modifica dei Template quindi, se ti preoccupa che questa possa essere un’esperienza ripetuta, non esserlo. Come promemoria, la modalità di modifica del Template è una caratteristica del Full Site Editing che sblocca la possibilità di passare tra la modifica del contenuto di una singola pagina o articolo e la modifica del template che quella singola pagina o articolo usano. Quando questa funzione è stata rilasciata inizialmente, era possibile modificare solo un template ma non era possibile crearne uno nuovo o assegnare un articolo o una pagina ad un template specifico. Adesso, invece, puoi creare un nuovo template, modificare quelli esistenti, e scegliere quale template usare per pagine ed articoli. A questo proposito, l’interfaccia è stata aggiornata per rendere più chiaro quando ti trovi effettivamente nella modalità di modifica del template. 

    Per rendere tutto questo un po’ più realistico, faremo finta di creare il sito per un WordCamp con una landing page che ha lo scopo di attrarre visitatori di un altro evento e farli partecipare al WordCamp che stai organizzando.

    Ambiente di test

    Anche se più avanti troverai maggiori informazioni per assicurarti di impostare tutto nel modo corretto, ecco gli aspetti chiave necessari per il tuo ambiente di test: 

    In generale, usa l’ultima versione di ognuna delle parti dell’impostazione raccomandata e tieni a mente che le versioni potrebbero essere cambiate da quando questo articolo è stato condiviso.

    Flusso del test

    Nota importante: 

    Anche se questa call per il test è focalizzata sulla prova di una funzionalità specifica, è probabile che troverai degli altri bug mentre utilizzi una funzione beta come questa! La segnalazione di tutti i bug che troverai è ben accetta nel rapporto che invierai riguardo il tuo test, anche se non sono direttamente riconducibili alla funzionalità di cui hai fatto il test.

    Problemi noti:

    Durante la preparazione di questa call per il test, sono saltati fuori alcuni problemi in cui potresti imbatterti durante la prova. Sappi che sono già stati segnalati. Ecco una lista non esaustiva di quelli più seri. 

    Ci si può aspettare che i problemi noti possano apparire in questa fase dello sviluppo per qualcosa che è attivamente oggetto di varie iterazioni!

    Istruzioni per la configurazione: 

    1. Imposta un sito che stia usando la versione più recente di WordPress. È importante che non si tratti di un sito di produzione/live.
    2. Installa il tema TT1 Blocks andando su Aspetto > Temi > Aggiungi Nuovo. Una volta installato, attiva il tema.
    3. Vai nell’area di amministrazione del sito
    4. Installa ed attiva il plugin Gutenberg da Plugin > Aggiungi nuovo. Se è già installato, assicurati che la versione in uso sia come minimo Gutenberg 10.6.
    5. Ora dovresti vedere all’interno della navigazione un elemento chiamato “Editor del sito (beta)”. Se non lo vedi ancora nella tua barra laterale, non stai usando correttamente l’esperimento di Modifica del Sito. Non fare clic su questa voce, dato che per questo test non stiamo esplorando l’editor del sito!

    Creare delle pagine 

    1. In Pagine, seleziona “Aggiungi pagina” e, una alla volta, crea tre pagine a cui dare i titoli “Chi siamo”, “Contatti” e “Codice di condotta”. Pubblica tutte le pagine. Non serve che abbiano del contenuto, dato che saranno semplicemente link per un futuro menu. 
    2. Crea una quarta pagina, scegli un titolo divertente per portare gente al tuo evento e non aggiungere ulteriore contenuto. Ad esempio, io ho intitolato la mia “Senti l’ispirazione di WordCamp Divano?”.
    3. Pubblica la pagina e tienila aperta.

    Creare un nuovo template

    1. Nella barra laterale, apri le impostazioni e seleziona le impostazioni della pagina (dovresti vedere Pagina e Blocco). Seleziona “Nuovo” all’interno della sezione Template per creare un nuovo template. Ecco un breve video nel caso dovessi bloccarti.
    2. Intitola il tuo nuovo template “Promozione WordCamp”.
    3. A questo punto, entrerai direttamente nella modalità di modifica del template.

    Personalizzare il template

    1. Rimuovi i blocchi Titolo del sito, Tagline del sito e Separatore nella parte alta del template.
    2. Inserisci un blocco Copertina sopra il blocco Titolo dell’articolo ed usa un’immagine a piacere. Io ho scaricato questa mentre creavo questo test. Potrebbe essere necessario usare l’opzione “Inserisci prima” nella barra degli strumenti del blocco Titolo dell’articolo.
    3. Una volta che hai aggiunto l’immagine, seleziona il blocco Copertina ancora una volta, anziché il blocco Paragrafo al suo interno, ed usa le opzioni di larghezza per rendere il blocco a larghezza piena.
    4. Trascina e rilascia il blocco Titolo del’articolo all’interno del blocco Copertina.
    5. Centra il blocco Titolo dell’articolo usando le impostazioni di allineamento e cancella il blocco paragrafo che si trova sotto di esso.
    6. Seleziona il blocco Copertina ancora una volta ed applica ad esso un filtro Bicromia. Ecco uno screenshot dell’icona ti serve. Nota che selezionando  Note that by selecting “Ombre” e “Highlights” puoi scegliere i tuoi colori personalizzati!
    7. Aggiungi un blocco Spaziatore sotto il blocco Copertina ed impostalo a 50px.
    8. Aggiungi un blocco Colonne sotto il blocco Spaziatore e scegli 50/50.
    9. Una volta inserito, scegli il blocco Colonne genitore ed imposta la larghezza a “Larghezza piena”.
    10. Aggiungi delle brevi informazioni sul tuo evento nella prima colonna, ed imposta l’allineamento che preferisci.
    11. Nella seconda colonna, aggiungi due pulsanti che dicono alle persone “Candidati come speaker” e “Candidati come sponsor”. Per questo test, va bene se i pulsanti non sono davvero collegati a qualcosa. Puoi comunque personalizzarli come preferisci!
    12. Sotto il blocco colonne, aggiungi un altro blocco Copertina e scegli un colore di sfondo
    13. Una volta che hai impostato il colore, seleziona nuovamente il blocco Copertina invece del blocco Paragrafo al suo interno ed usa le opzioni di larghezza per renderlo a larghezza piena.
    14. All’interno del blocco Copertina, aggiungi un messaggio riguardo un codice sconto ed un blocco Pulsante sotto di esso, per incoraggiare le persone ad acquistare i biglietti. Personalizza il testo a piacere, sia in termini di allineamento che di colori personalizzati, o altro ancora

    Creare un footer personalizzato

    1. Sotto il secondo blocco Copertina, aggiungi un blocco Parte del Template e seleziona “Nuova parte del template” per creare un footer personalizzato per questo template. 
    2. Una volta creato, vai sulle impostazioni del blocco nella barra laterale per aggiungere un titolo all’interno della sezione Avanzate. Assegna all’area il nome “Footer” all’interno dell’area Avanzate ed attiva l’opzione “Eredita il layout predefinito” all’interno della sezione Layout.
    3. Una volta fatto questo, aggiungi un blocco colonne all’interno della Parte del template e scegli 30/70.
    4. Nella prima colonna, aggiungi un blocco Logo del sito. Se ti serve un logo da usare, eccone uno gratuito che puoi scaricare da http://www.logodust.com
    5. Nella seconda colonna, aggiungi un blocco Navigazione ed inizia vuoto. Da notare, è probabile che riscontrerai questo bug che è stato già segnalato qui
    6. Usando l’opzione Link della pagina, aggiungi le tue pagine “Chi siamo”, “Contatti” e “Codice di condotta”. Personalizza il blocco Navigazione come preferisci!
    7. Una volta fatto questo, seleziona “Aggiorna” e salva le tue modifiche.

    Crea una nuova pagina ed assegna il nuovo template

    1.  A questo punto, torna alla tua bacheca wp-admin e, all’interno di Pagine, crea una nuova pagina.
    2. Come titolo, scegli qualcosa che abbia un riferimento ad un altro possibile evento di fantasia a cui qualcuno potrebbe partecipare. Ad esempio, “Senti l’ispirazione di WordCamp Veranda?”
    3. Nelle impostazioni dell’articolo, all’interno della sezione Template, seleziona il template che hai appena creato e pubblica la pagina. 
    4. Visualizza la tua pagina ed accertati che stia usando lo stesso template della tua prima pagina!

    Passi avanzati

    Se ti va di provare qualcosa più tecnico e vuoi cimentarti con idee per il futuro, dai un’occhiata a questa Pull Request. Tieni a mente che puoi sempre scaricare qui la versione del plugin Gutenberg specifica per questa PR in modo da rendere la cosa più facile da esplorare. Per darti un contesto, questa PR ha lo scopo di aiutare a differenziare meglio quando stai modificando il contenuto di un articolo da quando invece stai modificando il template, oscurando l’abilità di modifica dei contenuti dell’articolo quando ti trovi nella modalità di modifica del template. Condividi liberamente i tuoi pensieri su questa PR nel commenti di seguito o direttamente nella PR.

    Video del test

    Nota che sono stati aggiunti tre capitoli al video, che corrispondono ai passi di cui sopra.

    Cosa notare:

    Se ti va, ricorda di condividere uno screenshot di quello che hai creato!

    • L’esperienza si è bloccata in qualche punto?
    • L’esperienza del salvataggio ha funzionato correttamente?
    • Hai trovato delle funzioni mancanti?
    • Cosa hai trovato particolarmente confuso o frustrante riguardo l’esperienza?
    • Cosa ti è piaciuto o hai apprezzato in modo particolare riguardo l’esperienza?
    • Credi che quanto creato all’interno della modalità di modifica del template corrisponda a quello che vedi sul tuo sito?
    • Ha funzionato usando solo la tastiera?
    • Ha funzionato usando uno screen reader?

    Lascia un feedback entro il 26 Maggio 2021

    Lascia un feedback nei commenti di questo post. Se preferisci, puoi sempre creare delle issue in questo repo GitHub direttamente per Gutenberg ed in questo repo GitHub per TT1 Blocks. Anche se lasci un feedback in GitHub, commenta comunque di seguito indicando il link. Se vedi che qualcun altro ha già segnalato un problema, lascia comunque una nota qui di seguito riguardo la tua esperienza, sarà utile per fornire a chi sta lavorando per migliorare questa esperienza una panoramica più ampia su ciò che va migliorato.

    #core-editor, #fse-outreach-program, #fse-testing-call, #full-site-editing, #gutenberg