Come rendere visibili o nascondere contenuti sul tuo sito WordPress

Controllo totale dei contenuti grazie a questo plugin gratuito

Scritto da Tiziano Fogliata

Plugin come quello che ti segnalo in questo articolo sono l’ennesima conferma di quanto una piattaforma come WordPress possa essere flessibile, mettendoti a disposizione strumenti dalle incredibili potenzialità.

Mi riferisco al plugin Block Visibility, che permette di controllare in maniera chirurgica la visibilità dei blocchi all’interno dell’editor Gutenberg di WordPress.

Questo plugin ti permette di rendere visibile, oppure nascondere, ogni singolo blocco inserito in una pagina o articolo, ma anche del tema, se utilizzi un tema come GeneratePress che permette di creare elementi come il footer o la sidebar con l’editor a blocchi.

Block Visibility può gestire la visibilità in base a diversi criteri:

  • il ruolo dell’utente che sta visualizzando la pagina;
  • la data e l’ora attuali;
  • il fatto che il visitatore sia un utente loggato sul sito oppure no;
  • il tipo di dispositito utilizzato per visualizzare la pagina;
  • eventuali query string, ossia parametri presenti nell’url della pagina.

Proprio quest’ultimo punto è molto interessante soprattutto per la creazione di landing page e tra poco ti mostrerò un esempio.

Ma non basta, Block Visibility si integra anche con plugin come Advanced Custom Fields, ne avevo parlato qui, e WP Fusion, un plugin che permette di integrare WordPress con vari servizi di Email Marketing e CRM.

Come configurare il plugin Block Visibility

Questo plugin gratuito, una volta installato mette a disposizione una grande quantità di opzioni di configurazione. Opzioni che lo rendono modulare. Non si è quindi obbligati a vedere sempre tutte le funzionalità del plugin, ma puoi decidere di attivare solo quelle che ti servono.

Se non ti interessa avere accesso a tutte le condizioni di visualizzazioni, puoi decidere di vedere solo quelle che usi più spesso tra: data e ora, dimensione dello schermo, query string e ruoli utente.

Inoltre è anche possibile limitare le funzioni del plugin solo a determinati utenti del sito.

La pagina principale delle impostazioni del plugin Block Visibility

Ma non solo, se vuoi, puoi disattivare completamente alcune delle opzioni del plugin. C’è inoltre la possibilità di attivare delle impostazioni avanzate per quel che riguarda il controllo della visibilità basato sulle dimensioni dello schermo. Oltre a definire i breakpoint, ossia i punti nei quali far scattare la modalità desktop o tablet, puoi anche gestire la modalità di visualizzazione con orientamento verticale (portrait) e quella orizzontale (landscape).

Insomma, il livello di controllo è davvero elevato.

Altra pagina delle impostazioni del plugin Block Visibility

È anche possibile disattivare i controlli di visibilità su vari blocchi disponibili all’interno dell’editor. Questo sempre per ridurre la complessità e rimuovere le opzioni aggiuntive dove non ti servono.

Come funziona e come si utilizza il plugin Block Visibility con l’editor Gutenberg

Dopo averlo configurato, passiamo a vedere cosa ci offre questo plugin quando siamo alle prese con la creazione di una pagina o di un articolo su WordPress.

In pratica, per ogni blocco presente nella pagina, è possibile impostare dei criteri di visibilità, come ad esempio la data e l’orario a partire dal quale quel blocco deve essere visibile. Così come la data e l’orario dopo il quale deve sparire.
È anche possibile selezionare più periodi e invertire la logica di funzionamento, ossia definire un periodo nel quale il blocco deve essere nascosto.

I controlli sulla visibilità dei blocchi permessi dal plugin Block Visibility

La stessa cosa è possibile farla anche per decidere se il blocco deve essere visibile solo su deaktop, oppure su tablet oppure su mobile e tutte le varie combinazioni tra queste 3 categorie di dispositivo.

Una soluzione utilissima per le landing page (e non solo)

È però il controllo della visibilità basato sulle query string a essere una vera chicca di questo plugin. In pratica possiamo fare in modo che alcuni blocchi siano visibili (oppure nascosti) se l’url della pagina contiene o meno certi parametri.

Ecco un semplice esempio.

In questo caso ho impostato la visibilità di un blocco in modo che venga nascosto se nell’URL della pagina è presente il parametro ad=qwerty (parametro inventato sul momento).

Gestire la visibilità dei blocchi di Gutenberg in base alle query string

In modo analogo ho creato un blocco simile, ma con un’altra immagine di sfondo e un altro testo e ho impostato la visibilità in modo che appaia se l’URL contiene il parametro ad=qwerty.

Ecco cosa succede quando viene visualizzata la pagina senza il parametro:

Come appare la pagina senza query string

ed ecco invece come appare se nell’URL è presente il parametro:

In pratica la pagina è la stessa, ma la presenza o meno di quel parametro stabilisce quale dei due blocchi debba essere visibile. Vedi che oltre all’immagine di sfondo e al testo principale, cambia anche l’intestazione che precede il form di opt-in. Puoi in pratica variare il comportamento di tutti gli elementi della pagina.

Inoltre, l’aspetto interessante è che il blocco che non è visibile non viene nemmeno caricato a livello di codice HTML della pagina. Quindi non è nascosto usando il CSS, non viene proprio inserito. Questo significa che la pagina non viene appesantita dalla presenza dei blocchi che non devono essere visualizzati.

Se però la visibilità dei blocchi è gestita a livello di dispositivo (desktop, tablet e mobile) allora i blocchi vengono nascosti utilizzando il CSS, per ovvie ragioni che non sto nemmeno a spiegare.

Questa funzionalità, che permette di gestire la visibilità dei blocchi in base ai parametri presenti nell’URL, può tornare molto utile nelle landing page usate nelle campagne pubblicitarie. Puoi ad esempio variare il contenuto della pagina in base al parametro che inserisci nell’URL della landing page di un annuncio. Questa cosa funziona anche usando i parametri UTM, che ho già trattato in passato su questo sito.

Ancora più potente con WP Fusion e Advanced Custom Fields

Se Block Visibility rileva la presenza sul tuo sito dei plugin WP Fusion e Advanced Custom Fields, rende disponibili nuove possibilità per gestire la visibilità dei blocchi.

È infatti possibile sfruttare i valori inseriti in campi personalizzati creati con Advanced Custom Fields per definire se un blocco debba essere visibile o meno. Questo, potrà essere molto utile soprattutto per quei blocchi usati a livello di tema. Immagino ad esempio le potenzialità con il Full Site Editing con i temi che supporteranno questa funzionalità.

Per chi utilizza WP Fusion, è possibile definire la visibilità o meno di un blocco in base ai criteri di profilazione degli utenti presenti nel proprio CRM. Una funzione di questo tipo permette di rendere estremamente personalizzata l’esperienza degli utenti all’interno di un sito membership.

Gli iscritti con determinati interessi possono essere classificati con un determinato tag all’interno di un CRM come ActiveCampaign e, sempre grazie a quel tag, possono visualizzare determinati contenuti sul sito.

Block Visibility Pro

È disponibile anche un versione pro di Block Visibility che offre funzionalità aggiuntive specifiche per WooCommerce e Easy Digital Downloads e che consente di gestire la visibilità dei blocchi in base alla sorgente referral della visita, ossia il sito di provenienza del visitatore. È inoltre presente un controllo molto più granulare delle date, dei giorni e degli orari per impostare la visibilità dei blocchi.

Il plugin gratuito è comunque già più che sufficiente per la maggior parte delle situazioni.

Plugin alternativi

Al momento Block Visibility è il plugin che preferisco per gestire la visibilità dei blocchi con l’editor Gutenberg, ma non è l’unica soluzione esistente. Ti segnalo anche questi altri tue plugin: Conditional Blocks (a pagamento) e Content Visibility (gratuito).

Scarica l'ebook gratuito sui 10 errori da evitare sul tuo sito WordPress

Se ti è piaciuto e hai trovato utile questo articolo, eccone altri che potrebbero interessarti

Lascia un commento