Il Blocco immagine di WordPress è molto utile quando si inserisce e si mostra una singola immagine sul proprio sito web. Ma se si desidera visualizzare più foto contemporaneamente, il blocco Galleria è la scelta giusta.
Pertanto, devi imparare a usare il blocco galleria in WordPress. Una volta che padroneggerai le funzionalità del blocco galleria, potrai usarlo per migliorare le immagini del tuo sito web, rendendolo più professionale e accattivante.
Oggi, in questo tutorial, parleremo del blocco galleria di WordPress, delle caratteristiche della barra degli strumenti, delle opzioni di personalizzazione e di come utilizzarlo correttamente. Assicuratevi di seguirci dall'inizio alla fine.
Che cos'è il blocco galleria di WordPress?
Il blocco Galleria di WordPress è un blocco centrale nel Editor a blocchi di WordPress. Ti permette di creare e visualizzare una raccolta di immagini in un griglia formato. È perfetto per visualizzare foto di eventi, organizzare immagini in un layout accattivante o presentare immagini con il minimo sforzo.
Alcune funzioni vi avvantaggiano quando utilizzate il blocco. Scoprite queste caratteristiche qui di seguito.
- Personalizzazione: Regolare le colonne, la spaziatura e le didascalie per adattarle al proprio design. È inoltre possibile impostare risoluzioni diverse per le singole immagini della galleria.
- Design reattivo: Le immagini si adattano automaticamente alle diverse dimensioni dello schermo per un'esperienza senza soluzione di continuità su mobile, tablet e desktop.
- Integrazione integrata: Non sono necessari plugin aggiuntivi; il blocco funziona in modo nativo in WordPress.
- Compatibile con il SEOIl testo alternativo e le didascalie possono migliorare l'accessibilità e il posizionamento sui motori di ricerca dei tuoi contenuti. Puoi anche impostare il testo ALT per le singole immagini all'interno della galleria.
Caratteristiche della barra degli strumenti del blocco Galleria
Quando si inserisce il blocco galleria, nella parte superiore del blocco galleria compare una barra degli strumenti con varie funzioni per personalizzare la galleria. Tali funzioni sono riportate di seguito.
- Trasformare: È possibile trasformare questo blocco in un blocco Immagine, Colonne, Dettagli e Gruppo.
- Trascinare: Consente di trascinare e rilasciare il blocco dedicato in qualsiasi punto dell'editor.
- Maniglia di spostamento: Consente di spostare il blocco verso l'alto e verso il basso.
- Allineare: L'opzione Allinea consente di impostare l'allineamento dell'immagine su Nessuno, Larghezza ampia, Larghezza intera, Sinistra, Centro e Destra.
- Link: Questa opzione consente di aggiungere collegamenti per i contenuti selezionati all'interno del blocco.
- Didascalia: È possibile aggiungere didascalie utilizzando l'opzione editor per ogni immagine.
- Aggiungere: L'opzione Aggiungi consente di aggiungere o caricare nuove immagini nella galleria.
- Altre opzioni: Offre ulteriori opzioni relative alla sezione del blocco, come duplicare, copiare, raggruppare, ecc.
Come utilizzare il blocco Galleria in WordPress
Usare il blocco Galleria in WordPress è semplice. Basta seguire i passaggi seguenti:
Passo 1: Aggiungere il blocco Galleria nell'editor
Aprire il post o la pagina, fare clic sull'icona "+" per aggiungere un blocco e cercare "Gallery". Selezionare il blocco Galleria per inserirlo nel post o nella pagina.
Passo 2: caricare le immagini
È possibile caricare le immagini o selezionarle dalla libreria multimediale.
Come inserire le immagini tramite l'opzione di caricamento
Per inserire file di immagine, fare clic sul pulsante di caricamento, selezionare le immagini con il cursore mentre tenendo premuto il tasto CTRL della tastiera e fare clic su Apri. Ecco fatto. Le immagini vengono visualizzate nell'editor.
Come inserire un'immagine tramite l'opzione Libreria multimediale
Fare clic sul pulsante Libreria multimediale, selezionare le immagini e fare clic sui pulsanti Crea una nuova galleria e Inserisci galleria per inserire le immagini nell'editor.
Una volta inserite tutte le immagini nella galleria, si possono vedere tutte le funzioni della barra degli strumenti del blocco immagine. È possibile controllare queste funzioni qui.
Passo 3: Personalizzazione della galleria
Per la personalizzazione della galleria, andare su Impostazioni (1) > Blocco (2) > Impostazioni (3). È possibile selezionare le colonne, la risoluzione e altre opzioni.
- Colonne: Le colonne consentono di determinare il numero di immagini da visualizzare nell'editor. Più immagini si aggiungono, più colonne verranno aggiunte alla Galleria. (4)
- Risoluzione: È possibile impostare la risoluzione dell'immagine su Miniatura e Dimensione intera. (5)
- Ritagliare le immagini per adattarle: Questa funzione mantiene il rapporto di ogni immagine e ne adatta le dimensioni.
- Ordine casuale: Questa funzione non mantiene la serie, ma visualizza le immagini a una serie casuale.
L'opzione Stili presenta le seguenti opzioni.
- Colore: L'opzione colore consente di modificare il colore di sfondo del blocco Galleria.
- Dimensioni: L'opzione Dimensioni consente di modificare la spaziatura dei blocchi (spazio tra due blocchi come le immagini), il margine e il padding.
- Bordo e raggio: Questa funzione consente di aggiungere un bordo, un colore e un raggio alla galleria.
Ecco la demo completa della galleria che ho creato.
Crea una galleria interattiva con Galleryberg
Mentre il blocco Galleria predefinito è eccellente per griglie semplici, manca di funzionalità come lightbox, effetti al passaggio del mouse e layout diversi.
Se desideri una galleria più accattivante senza scrivere codice, Galleria plugin è un'alternativa gratuita che estende l'editor a blocchi con strumenti aggiuntivi. Ti permette di passare tra layout a tessere, a griglia, giustificati e quadrati, e aggiunge una light box integrata per lo zoom e la navigazione.
Galleryberg include anche effetti di hover discreti e controlli reattivi in modo che le tue gallerie risultino moderne sia su desktop che su dispositivi mobili.
Ora vediamo come utilizzare il plugin Galleryberg.
Passo 1: installare il plugin Galleryberg
Vai alla tua bacheca di WordPress e naviga su Plugin → Aggiungi nuovo e cerca Galleryberg. Quindi installa e attiva il plugin.
Passaggio 2: Inserire il blocco Galleria Galleryberg
Crea un nuovo post/pagina o modifica uno esistente. Fai clic sul pulsante “+”, cerca Galleryberg e aggiungi il blocco.
Passo 3: Aggiungi le tue immagini
Carica nuove immagini o selezionale dalla Libreria Media e fai clic su Seleziona.
Passo 4: scegliere un layout
Per impostazione predefinita, il blocco utilizza un layout a riquadri. Nella barra laterale del blocco, puoi passare a Muratura, Giustificato, o Quadrato per adattarsi meglio al tuo design.
Ogni layout riorganizza automaticamente le immagini e puoi regolare colonne, spaziature e bordi.
Passaggio 5: Abilita la light box
Commutare Abilita Lightbox nelle impostazioni del blocco per consentire ai visitatori di fare clic su un'immagine e visualizzarla in un popup con zoom e navigazione a scorrimento.
Il lightbox include controlli da tastiera e touch, quindi funziona in modo fluido su desktop e telefoni.
Passaggio 5: Esplora effetti al passaggio del mouse e didascalie
Usa le impostazioni della didascalia per visualizzare testo sotto le immagini o come sovrapposizione che appare al passaggio del mouse. Le animazioni al passaggio del mouse di Galleryberg (zoom avanti/indietro e sovrapposizioni) rendono la galleria interattiva senza distrarre.
Fase 6: Anteprima e pubblicazione
Una volta soddisfatto, visualizza in anteprima la tua galleria e pubblica o aggiorna il post. La tua galleria sarà reattiva e ottimizzata per le prestazioni grazie al rendering lato server.
Perché usare Galleryberg invece del blocco Core?
Il blocco Galleria principale offre layout a griglia di base ma manca di funzionalità come una lightbox, animazioni al passaggio del mouse e layout vari. Galleryberg fornisce quattro diversi stili di galleria, una lightbox reattiva con zoom e navigazione da tastiera, e controlli intuitivi per spaziature, colori e didascalie. Supporta persino effetti al passaggio del mouse reattivi per aggiungere sottili animazioni. Se hai bisogno di una galleria che incoraggi i visitatori a interagire con le tue immagini e si integri perfettamente nell'editor a blocchi, Galleryberg è una soluzione leggera e di facile utilizzo.
Pensieri finali!
Il blocco Galleria è un potente strumento dell'editor di blocchi Gutenberg. Consente di visualizzare le collezioni di immagini senza bisogno di plugin aggiuntivi.
È una scelta eccellente per tutti per la sua flessibilità, le opzioni di personalizzazione e la perfetta integrazione con WordPress.
Provatelo e scoprite come può trasformare il modo in cui presentate le immagini sul vostro sito web.
Fatemi sapere cosa ne pensate di questo tutorial nella sezione commenti qui sotto. Inoltre, fatelo conoscere ai vostri amici attraverso i vostri social media.
Per saperne di più!
