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