Avere il controllo sui contenuti che vengono visti e in quali condizioni può essere estremamente utile per qualsiasi sviluppatore o designer WordPress.
Nell’ecosistema di WordPress ci sono molti plugin che possono essere d’aiuto. Qui presentiamo quattro plugin che permettono di:
- Nascondere i contenuti in bozza su una pagina già pubblicata.
- Applicare condizioni di visualizzazione a gruppi, header e footer.
- Mostrare i contenuti in base alla data e all’ora.
- Visualizzare design diversi a seconda del tipo di dispositivo.
Una differenza fondamentale tra i plugin che abbiamo analizzato è la facilità con cui si possono eseguire queste operazioni.
I plugin che abbiamo selezionato permettono di mostrare o nascondere i contenuti all’interno dei blocchi. Non ci occupiamo di soluzioni più estese come i plugin per le iscrizioni, che limitano l’accesso alle pagine, né di soluzioni per bloccare, sbloccare o nascondere i blocchi stessi. Per questo, si può consultare il nostro articolo su Come disabilitare e bloccare i blocchi di Gutenberg.
Tutti e quattro i plugin dovrebbero funzionare bene con temi a blocchi, ibridi o classici. Supportano anche i pattern, i pattern parzialmente e completamente sincronizzati.
Anche se il codice personalizzato non è sempre la soluzione migliore per mostrare o nascondere i blocchi, forniremo anche alcuni frammenti di codice come esempio.
Plugin per mostrare o nascondere i contenuti dei blocchi in WordPress
I plugin che esaminiamo hanno funzionalità simili ma sono implementati in modi diversi. La maggior parte fornisce impostazioni globali in WP Admin > Impostazioni, ad eccezione degli ultimi due plugin citati nella sezione Altri plugin, che non dispongono di queste opzioni.
Tutti forniscono controlli di visibilità per blocco nel Block Inspector (la barra laterale destra) all’interno dell’editor, sia nell’editor dei post che nell’editor del sito.
Block Visibility
Block Visibility è uno dei plugin più conosciuti in questo settore. È disponibile fin dagli albori dell’editor di blocchi. Offre le funzionalità più complete con un’interfaccia utente intuitiva ed è completamente gratuito, senza versione premium.
È possibile impostare controlli di visibilità su qualsiasi blocco in base a diverse condizioni, sia singolarmente che in combinazione:
- Browser & Device: mostra o nasconde un blocco in base al browser del visitatore (Chrome, Firefox, Safari, ecc.) o al tipo di dispositivo (desktop, tablet, mobile).
- Cookie: controlla la visibilità in base alla presenza di un cookie specifico nel browser dell’utente, utile per la personalizzazione.
- Date & Time: pianifica la visualizzazione del contenuto in modo che sia visibile in determinate ore o in determinate date, come ad esempio la visualizzazione di un messaggio solo durante l’orario di lavoro.
- Hide Block: un override diretto che nasconde completamente un blocco, indipendentemente da altre condizioni.
- Location: mostra o nasconde i contenuti in base alla posizione geografica del visitatore (paese, regione o città).
- Metadata: controlla la visibilità utilizzando valori di metadati personalizzati, spesso utili per i contenuti dinamici nei tipi di post personalizzati.
- Query string: visualizza o nasconde i blocchi in base ai parametri dell’URL (ad esempio mostra un blocco solo se
?promo=trueè presente nell’URL). - Referral Source: cambia la visibilità in base alla provenienza del visitatore (ad esempio, nasconde un’offerta speciale se l’utente arriva da Google).
- Screen Size: regola la visibilità in base alla larghezza dello schermo, consentendo di visualizzare contenuti diversi per gli utenti di cellulari, tablet o desktop.
- URL Path: mostra o nascondi i blocchi in base all’URL della pagina, utile per visualizzare i contenuti solo su pagine o sezioni specifiche del sito.
- User Role: limita la visibilità in base al ruolo dell’utente connesso, ad esempio per mostrare contenuti esclusivi agli amministratori o agli iscritti.
Il plugin dispone anche di funzioni aggiuntive per la gestione della visibilità dei blocchi:
- Visibility Presets: salva e applica impostazioni di visibilità predefinite a più blocchi.
- Copy & Import Settings: duplica le impostazioni di visibilità in diversi blocchi.
Inoltre, è disponibile direttamente nella barra degli strumenti del blocco un pulsante Hide block from everyone, che permette di nascondere completamente qualsiasi blocco.
Vediamo due esempi d’uso di questo plugin.
Date & Time
Il plugin Block Visibility offre il controllo completo sulla programmazione dei contenuti in base a condizioni di data e ora. È possibile impostare intervalli di tempo specifici, date o combinazioni di entrambi.
Ad esempio, vogliamo visualizzare un titolo quando il negozio è aperto e un altro quando è chiuso:
- “Il negozio è aperto” deve essere visibile tra le 8.00 e le 17.00.
- “Siamo chiusi” deve essere visibile in tutti gli altri orari.
Se è la prima volta che si usa il plugin, basta far clic sull’icona più (+) o sul menu delle opzioni a tre punti per visualizzare le opzioni di controllo e selezionare Data e Ora. Si eseguirà questa operazione per entrambi i blocchi di testa.
Applichiamo la condizione 8.00-17.00 all’intestazione “Il negozio è aperto”.
L’intestazione “Siamo chiusi” richiede due serie di dati per rispondere al cambio del giorno a mezzanotte.
La configurazione risultante visualizza i titoli secondo le impostazioni salvate nella condizione di visibilità.
Referral Source
In questo esempio, nascondiamo un pulsante nel caso in cui il referral contiene una parte qualsiasi di un URL determinato. Avremmo anche potuto decidere di visualizzare il pulsante se il referral contiene una parte qualsiasi di un URL prescritto.
Infine, in Impostazioni > Visibilità del blocco, si trovano tre sezioni:
- General Settings
- Visibility Controls
- Block Manager
Per un’esperienza ottimale, consigliamo di attivare Full Control Mode nelle Impostazioni generali. In questo modo le impostazioni di visibilità saranno disponibili per ogni blocco.
Alcuni blocchi, come il blocco Pulsante, richiedono questa impostazione perché i controlli di visibilità del plugin non sono abilitati di default nel pannello di ispezione.
Content Control
Da non confondere con il plugin Restrict Content, il plugin Content Control fornisce due condizioni per nascondere o mostrare il contenuto.
- Device Rules: controlla la visibilità del blocco in base al tipo di dispositivo (desktop, tablet o mobile).
- User Rules: visualizza un blocco in base ai ruoli degli utenti, che possono essere impostati per gli utenti connessi, per gli utenti non connessi, per tutti i ruoli, per ruoli specifici o con esclusione di determinati ruoli.
Queste regole possono essere utilizzate separatamente o combinate per creare condizioni di visibilità flessibili. Ad esempio, utilizziamo le Device Rules per visualizzare un’immagine ottimizzata per schermi di diverse dimensioni. L’immagine più grande è impostata in modo da essere visualizzata solo sui desktop.
- A: nell’editor della pagina, le viste da Mobile e Tablet sono disattivate.
- B: nel front-end, l’immagine è correttamente dimensionata per i desktop.
Inoltre, l’immagine ottimizzata per i dispositivi mobili è configurata in modo da apparire solo su tablet e dispositivi mobili.
- A: nell’editor della pagina, la visualizzazione Desktop è disattivata.
- B: nel front-end, l’immagine viene visualizzata per tablet e dispositivi mobili.
Questa impostazione fa sì che gli utenti vedano le dimensioni dell’immagine più adatte al loro dispositivo, migliorando le prestazioni e l’esperienza dell’utente.
Inoltre, ogni blocco include anche quattro impostazioni facoltative, accessibili tramite il menu delle opzioni a tre punti:
- Copy: copia le impostazioni del blocco.
- Paste: applica le impostazioni copiate da un altro blocco.
- Restore Default: ripristina tutte le condizioni di visibilità del blocco.
- Disable Device Rules / Disable User Rules: disattiva temporaneamente le condizioni di visibilità senza cancellarle.
Consigliamo vivamente di utilizzare le opzioni Disable Device Rules o Disable User Rules per testare il plugin. In questo modo sarà più facile reimpostare e regolare le impostazioni di visibilità se necessario.
All’interno di WP Admin > Impostazioni, si trovano diverse impostazioni globali per il plugin, come la definizione dei breakpoint. Ecco le impostazioni predefinite per i tre dispositivi.
All’interno di queste impostazioni, è possibile anche disattivare il plugin per qualsiasi blocco. La versione premium di questo plugin offre queste e molte altre funzionalità:
- Block scheduling: imposta condizioni di visibilità basate sul tempo.
- WooCommerce rules: controlla la visibilità dei blocchi in base alle impostazioni di WooCommerce.
- Easy Digital Downloads rules: limita i contenuti per i clienti dei prodotti digitali.
- Boolean rules: usa condizioni logiche per la visibilità dei blocchi.
- Rule engine for blocks: crea condizioni di visibilità personalizzate più flessibili.
Altri plugin
Oltre alle soluzioni più note e diffuse, esistono due plugin meno conosciuti e con un minor numero di installazioni attive che forniscono controlli sulla visibilità dei blocchi:
Conditional Blocks – Advanced Content Visibility
Il plugin Conditional Blocks permette di controllare la visibilità dei blocchi di WordPress utilizzando una logica avanzata, il tutto all’interno di una semplice interfaccia modale. È possibile impostare delle condizioni per stabilire quando e dove un blocco deve essere visibile.
La versione gratuita di Conditional Blocks offre controlli di base sulla visibilità, come ad esempio:
- Lockdown Block from Everyone: nasconde completamente un blocco.
- Responsive Visibility: mostra o nasconde i blocchi in base al tipo di dispositivo (mobile, tablet o desktop).
- User Status Conditions: l’opzione User Logged In visualizza i blocchi solo per gli utenti connessi, mentre l’opzione User Logged Out visualizza i blocchi solo per gli utenti disconnessi.
- AND/OR Condition Logic: combina più regole per creare condizioni di visibilità complesse.
La versione Pro estende le funzionalità con altre caratteristiche, tra cui:
- Preset Manager: permette di salvare gruppi di regole e applicarle a più blocchi per avere una gestione più efficiente.
- Advanced Breakpoints: definisce dimensioni dello schermo personalizzate per i diversi dispositivi.
- Geolocation Control: mostra o nasconde i blocchi in base alla posizione dell’utente (richiede una chiave API).
- Toolbar Settings: permette di gestire le condizioni di visibilità direttamente dalla barra degli strumenti dei blocchi.
- User Role-Based Visibility: limita la visibilità dei blocchi in base al ruolo dell’utente (ad esempio amministratori, iscritti, clienti).
- Scheduling Options: configura i blocchi in modo che appaiano solo in determinati intervalli di date o orari.
- WooCommerce & Membership Integrations: controlla la visibilità in base al contenuto del carrello, alle iscrizioni degli utenti e altro.
Per chi ha bisogno di maggiore flessibilità e di una logica condizionale avanzata, la versione Pro offre un kit completo di strumenti per gestire la visibilità dei contenuti su larga scala.
Wicked Block Conditions
Il plugin Wicked Blocks Conditions è un plugin gratuito che permette di nascondere o visualizzare i blocchi in base a diversi criteri:
- User login status: mostra o nasconde i blocchi a seconda che un utente abbia effettuato o meno l’accesso.
- User role: limita la visibilità in base al ruolo dell’utente.
- Date and time: programma la visibilità dei contenuti in base al tempo.
- Post categories or tags: visualizza i contenuti in base alla categoria o al tag assegnato.
- Post status: controlla la visibilità in base allo stato del post: pubblicato, in bozza, in attesa, ecc.
- Query string parameter: regola la visibilità in base ai valori dell’URL.
- Custom PHP function: permette di creare una logica personalizzata offrendo un controllo avanzato della visibilità.
La possibilità di utilizzare funzioni PHP personalizzate rende questo plugin particolarmente utile per gli sviluppatori che vogliono aggiungere la propria logica direttamente all’interno dell’interfaccia utente.
Aggiungere il proprio codice per mostrare o nascondere il contenuto dei blocchi
Se il caso d’uso è semplice e si preferisce caricare solo ciò che è necessario, si può scrivere del codice personalizzato invece di installare un plugin. Si può scrivere un plugin o aggiungere funzioni direttamente al file functions.php.
Di seguito sono riportati tre esempi basati su PHP, ma se le prestazioni sono una priorità, potrebbe essere preferibile scrivere codice JavaScript.
Nascondere il contenuto in base allo stato di accesso dell’utente
Il codice che segue nasconde tutti gli elementi paragrafo (<p>) per gli utenti che hanno effettuato l’accesso:
add_action( 'wp_head', 'kinsta_toggle_paragraphs_visibility' );
function kinsta_toggle_paragraphs_visibility() {
if (is_user_logged_in() ) {
echo 'p { display: none !important; }';
}
}La funzione controlla se l’utente ha effettuato l’accesso utilizzando is_user_logged_in(). Se la condizione è vera, inietta il CSS nella sezione <head>, nascondendo tutti gli elementi <p> con display: none;. Il markup rimane nel sorgente della pagina, ma non è visibile agli utenti.
È possibile modificare questo comportamento sostituendo is_user_logged_in() con:
!is_user_logged_in(): nasconde il contenuto quando l’utente non è connesso.is_user_logged_out(): una funzione alternativa per rilevare gli utenti non connessi.!is_user_logged_out(): un altro modo per verificare se l’utente è connesso.
Nascondere i contenuti in base alla geolocalizzazione
Supponiamo di voler nascondere i contenuti agli utenti di una determinata località. Non ci sono limiti a quello che si può mostrare o nascondere, ma in questo caso abbiamo adottato un approccio generale e abbiamo nascosto tutte le immagini agli utenti con sede negli Stati Uniti.
add_action('wp_head', 'kinsta_hide_images_for_us_visitors');
function kinsta_hide_images_for_us_visitors() {
// Get visitor's IP address
$user_ip = $_SERVER['REMOTE_ADDR'];
$geo_api_url = "https://ipapi.co/{$user_ip}/json/";
// Fetch geolocation data
$response = wp_remote_get($geo_api_url);
if ( is_wp_error($response) ) {
return; // Exit if API request fails
}
$data = json_decode( wp_remote_retrieve_body($response) );
// Check if the user is from the U.S.
if ( isset($data->country_code) && $data->country_code === 'US' ) {
echo 'h1, h2, h3, h4, h5, h6 { display: none !important; }';
}
}Nota:
$_SERVER['REMOTE_ADDR']non è sempre affidabile e potrebbe restituire IP non corretti.- Richiamare l’API ad ogni caricamento di pagina può avere un impatto negativo sulle prestazioni. Un approccio più efficiente sarebbe memorizzare temporaneamente i dati della risposta nella cache utilizzando un transient di WordPress.
Nascondere un’immagine in evidenza per categoria
Nessuno dei plugin che abbiamo esaminato prevedeva una soluzione per mostrare o nascondere i titoli delle pagine o le immagini in evidenza, in quanto non si tratta di blocchi. Vediamo, quindi, come nascondere immagine di anteprima per tutti i post nella categoria books.
add_filter('post_thumbnail_html', 'kinsta_hide_featured_image_for_books_category', 10, 2);
function kinsta_hide_featured_image_for_books_category($html, $post_id) {
// Check if the post belongs to the "Books" category
if (has_category('books', $post_id)) {
return ''; // Hide the featured image by returning an empty string
}
return $html; // Show the featured image if the category is not "Books"
}Questo filtro controlla se il post appartiene alla categoria Books utilizzando has_category(). Se la condizione è true, rimuove l’immagine in evidenza restituendo una stringa vuota. Altrimenti, mantiene l’immagine in primo piano invariata.
Testare l’implementazione
Prima di distribuire il plugin o il codice personalizzato, consigliamo di eseguire dei test approfonditi per evitare problemi indesiderati, come ad esempio la restrizione dei contenuti al pubblico previsto. Ecco alcune fasi di testing:
- Garantire la compatibilità: verificare che il plugin o il codice personalizzato funzioni correttamente, soprattutto con i plugin di blocchi di terze parti.
- Esaminare il codice sorgente: alcuni strumenti nascondono i contenuti utilizzando i CSS, altri li eliminano completamente dal markup. Bisogna considerare l’impatto di ciascun approccio sulla SEO prima di prendere una decisione.
- Usare un ambiente di staging: Kinsta fornisce ambienti di staging per WordPress per tutti gli account, consentendo di testare in sicurezza le modifiche prima di applicarle a un sito di produzione.
Riepilogo
Il controllo della visibilità dei contenuti è essenziale per la gestione di un sito WordPress. L’approccio che si decide di seguire, utilizzare un plugin standard o del codice custom, dipende dalle esigenze specifiche e dalle competenze tecniche.
Se vuoi un host che ti permetta di gestire facilmente lo sviluppo, testare i plugin e mantenere il sito sicuro, prova Kinsta.
Le vulnerabilità possono essere un problema reale, ma con Kinsta puoi contare su scansione automatica del malware ogni tre minuti, firewall di livello enterprise e su una piattaforma ottimizzata che ti garantisce velocità e affidabilità. Prova Kinsta oggi stesso.
Bud Kraus has been working with WordPress as an in-class and online instructor, site developer, and content creator since 2009. He has produced instructional videos and written many articles for WordPress businesses.
