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