Come creare una pagina del blog con Gutenberg (basato sul tema Gutenberry)

Da questo tutorial troverai tutto ciò di cui hai bisogno per creare una pagina del blog con l'editor Gutenberg e il tema GutenBerry.

Creare una pagina del blog con Gutenberg

Una pagina del blog è una pagina in cui i tuoi visitatori vedono tutte le pubblicazioni esistenti sul tuo sito web. È una pagina dinamica, ovvero mostra le pubblicazioni aggiunte sul tuo sito dalle più recenti alle prime, ordinandole per data.

È importante sapere che al momento puoi progettare il modo in cui le pubblicazioni vengono visualizzate, tuttavia, l'estratto del post, l'immagine in primo piano, il meta del post e il titolo verranno estratti dalla pubblicazione.

Devi assicurarti che ci siano pubblicazioni sul tuo sito e di aver impostato in anticipo l'immagine in primo piano e tutte le informazioni che desideri mostrare nella pagina del blog nell'elenco dei post.

Per creare una pagina del blog sul tuo sito web, devi andare su Pagine > Aggiungi nuovo, e ci siamo!
Prima di tutto, devi scegliere il nome della tua pagina. Lo chiameremo "La mia prima pagina del blog", ma il nome della tua pagina deve essere una piccola introduzione.

Puoi riempire la pagina con il classico blocco dei post di Gutenberg. Tuttavia, se vuoi risparmiare tempo e ottenere ulteriori impostazioni per personalizzare la tua pagina del blog, puoi utilizzare il plug-in ZeGuten. Ha 5 layout di post reattivi per rendere la tua pagina più attraente e coinvolgente.

Creazione di una pagina del blog basata su Gutenberry

Dopo aver creato una pagina del blog, puoi accedere a Dashboard > Impostazioni > Lettura e qui individuare il menu a discesa della pagina dei post. Specifica la pagina che hai appena creato e premi il pulsante Salva modifiche.

Congratulazioni! Ora hai assegnato la pagina appena creata come pagina del tuo blog. Tuttavia, ci sono ancora tanti modi che puoi fare per personalizzarlo e renderlo unico.

Apri la pagina del blog appena creata in Customizer e accedi alla scheda Impostazioni blog, quindi vai alla scheda Blog per vedere cosa puoi fare.

Per impostazione predefinita, molto probabilmente, vedrai tutte le pubblicazioni sul tuo sito mostrate come un elenco. Per modificare la modalità di visualizzazione delle pubblicazioni utilizzare:

Layout Blog Type: qui puoi scegliere un layout dal menu a discesa per visualizzare le tue pubblicazioni come una griglia.

Colonne: quando hai impostato un layout a griglia per il tuo blog, vedrai il menu a discesa per scegliere il numero di colonne in cui verranno visualizzati i post.

Ci sono anche le impostazioni che ti aiuteranno a decidere quali metadati per i post che vuoi mostrare: autore del post, data di pubblicazione, categorie, tag, conteggio dei commenti, ecc.

L'ultima casella di controllo consente di abilitare la visualizzazione dell'estratto dei post.

Abilita il pulsante Mostra Leggi di più per consentire ai visitatori di fare clic su di esso e navigare alla pagina del singolo post.

Inoltre dovresti impostare il tipo di etichetta adesiva per contrassegnare i tuoi post come appiccicosi, se ce ne sono.

Abilitazione della navigazione per la pagina del blog

Quando hai molti post sul tuo sito (sì, sei un blogger, certo che li hai) sai quanto potrebbe sentirsi a disagio il visitatore quando ha bisogno di scorrere la pagina verso il basso mentre cerca un particolare post che hai pubblicato qualche tempo fa.

Per semplificare il processo, puoi aggiungere un tipo di navigazione alla pagina del blog. Può essere un'opzione che consente di passare da una pagina all'altra o frecce di navigazione.

Mentre sei in Customizer, puoi modificare il tipo di navigazione da utilizzare per la pagina Blog nel menu a discesa Tipo di navigazione.

Qui puoi scegliere Impaginazione o Navigazione.

Se non vedi alcun elemento di impaginazione, significa che devi comunque impostare il numero di post da mostrare per pagina.

Vai su Dashboard > Impostazioni > Lettura e definisci il valore massimo che le pagine del blog mostrano (dovrebbe essere inferiore al numero di post che hai per vedere l'opzione di impaginazione).

Nella maggior parte dei casi questo sarà sufficiente per creare una pagina del blog. Tuttavia, se desideri creare una pagina statica con un elenco dinamico delle pubblicazioni, puoi farlo in Gutenberg. Continua a leggere per sapere come.

Creare una pagina blog statica con contenuti dinamici usando Gutenberg

Ancora una volta dovresti creare una nuova pagina. E ora iniziamo.

Aggiungiamo il blocco Post alla tela della pagina! Basta fare clic sull'icona "+" vista a sinistra dal testo "Inizia a scrivere o digita / per scegliere un blocco". Scegli il blocco chiamato "Post" - puoi individuarlo nella categoria dei blocchi ZeGuten.

Ora puoi vedere che il blocco Post mostra le pubblicazioni che hai sul tuo sito utilizzando le impostazioni predefinite. Modifichiamoli un po' per ottenere risultati migliori.

A proposito, puoi facilmente usare le scorciatoie per Gutenberg per velocizzare il tuo lavoro. Se non sai come usare le scorciatoie da tastiera, sentiti libero di leggere questa guida.

Impostazioni di blocco dei post. Impostare il layout dei post in Gutenberg

Stabiliamo tutte le impostazioni necessarie per lavorare con il design del layout dei post e il contenuto che vuoi estrarre dai tuoi post per mostrarlo nel blog. Fortunatamente, nell'editor Gutenberg, puoi fare tutto ciò di cui hai bisogno durante l'utilizzo del blocco Post. Non ci vorranno più di alcuni minuti.

Blocco post: opzioni di layout

Individua la barra delle impostazioni del blocco a destra dell'area di disegno della pagina. Se non lo vedi, significa che lo hai già chiuso. Per recuperarlo, fai clic sull'icona della ruota dentata nell'angolo in alto a destra. Quindi fai clic sul blocco Post sulla tela per renderlo attivo e accedere alle sue impostazioni.

Il blocco Post consente di scegliere tra 3 diverse opzioni di layout:

• Elenco dei post: è un layout pulito in cui i post sono disposti uno per uno in una colonna;
• Griglia dei post: un layout in cui è possibile visualizzare i post in più colonne e righe, impostando la griglia per mostrare le pubblicazioni;
• Elenco dei messaggi irregolari: utilizza questo layout per disporre i messaggi nell'ordine degli scacchi. Qui avrai una colonna e i post vengono visualizzati uno per uno sotto forma di elenco con le righe pari che mostrano l'immagine in primo piano a sinistra e la visualizzazione irregolare a destra.

Apri le Impostazioni post di seguito per scegliere le pubblicazioni che desideri estrarre utilizzando questo blocco.

Qui puoi impostare:

• Categoria – la categoria da cui si desidera visualizzare le pubblicazioni.
• Numero di elementi: limita le pubblicazioni a un certo numero e non visualizzare più di un certo numero. Il massimo è 100 pubblicazioni, ma puoi certamente utilizzare le impostazioni Leggi di più per far sembrare il blocco più breve.
• Colonne: utilizza questo interruttore per impostare il numero delle colonne per il layout della griglia. Il numero massimo di colonne è 6.
• Seleziona tag titolo: qui puoi impostare il tag html da utilizzare per il titolo (H1 – H6). Assicurati che il tuo titolo sia impostato correttamente per avere un intervallo più alto nei risultati di ricerca.
• Ordina per: questa opzione consente di ordinare le pubblicazioni dalla meno recente alla più recente, dalla più recente alla meno recente e utilizzare l'ordine alfabetico per impostare un ordine.

Ci sono anche opzioni per:

• visualizzazione dell'immagine in primo piano: devi assicurarti di aver impostato le immagini in primo piano nelle tue pubblicazioni per poterle vedere;
• visualizzazione della data del post: un'opzione per mostrare la data in cui è stato pubblicato il post;
• visualizzazione della categoria del post: questo consentirà al visitatore di vedere a quale categoria è correlato il post;
• visualizza estratto del post: abilita questa opzione per mostrare un estratto del tuo post (può essere personalizzato o un estratto generato dal tuo contenuto), sarai anche in grado di impostare la lunghezza del contenuto dell'estratto tagliando il numero di parole;
• mostra l'autore del post: attiva questo interruttore per mostrare chi ha scritto questa pubblicazione.

Leggi altre impostazioni

Finché desideri che i visitatori aprano i tuoi post e procedano alla lettura, sarai in grado di visualizzare un link Leggi di più e personalizzare la modalità di visualizzazione, sostituire il testo predefinito con il tuo, ecc.

Sarai anche in grado di decidere se vuoi visualizzare l'opzione Leggi di più per ogni post come testo o come pulsante.

Il blocco dei post è utile per lavorare con le pubblicazioni dinamiche, ma non consente ancora di sfruttare tutta la potenza della query personalizzata. Eppure sarà una risorsa senza pari quando si lavora con le pagine statiche del tuo sito web di blog.

Tieni presente che non ci sono ancora opzioni di impaginazione, quindi se vuoi mostrare tutti i tuoi post, devi impostare il numero di post al massimo. Puoi anche assegnare la pagina appena creata come pagina principale del tuo blog nelle Impostazioni, oppure puoi mantenere le cose così come sono e mostrarle come il tuo blog solo nel menu (dove dovresti collegarlo), mantenendo il Blog pagina come archivio dei tuoi post.

L'altro modo per affrontare questo compito è aggiungere un collegamento alla pagina dell'archivio dei post (un vero Blog che hai creato nella prima parte di questo tutorial) in fondo all'elenco dei post per consentire ai visitatori di accedere a tutte le pubblicazioni.

Congratulazioni! Hai creato e progettato la tua prima pagina del blog! Iscriviti alla nostra newsletter per ricevere ulteriori suggerimenti su come lavorare con Gutenberg e Gutenberry!