Tener control sobre qué contenido se ve y en qué condiciones es una herramienta valiosa para cualquier desarrollador o diseñador de WordPress.
Afortunadamente, hay muchos plugins entre los que elegir en el ecosistema de WordPress que pueden ayudar. Aquí hablamos de cuatro plugins que te permiten:
- Ocultar contenido en estado borrador de páginas en producción.
- Aplicar condiciones de visualización a grupos, encabezados y pies de página.
- Mostrar contenido en función de la fecha y la hora.
- Mostrar diferentes diseños según el tipo de dispositivo.
Una diferencia clave entre los plugins que hemos revisado es lo fácil — o difícil — que resulta realizar estas acciones.
Nuestros plugins seleccionados se centran en mostrar u ocultar contenido dentro de los bloques. No abordamos soluciones más amplias, como los plugins de membresía que restringen el acceso a la página, ni discutimos cómo bloquear, desbloquear u ocultar los propios bloques. Para eso, consulta nuestro artículo Cómo desactivar y bloquear los bloques de Gutenberg.
Los cuatro plugins deberían funcionar con temas de bloque, híbridos o clásicos. También soportan patrones, patrones parcialmente sincronizados y patrones totalmente sincronizados hechos con bloques.
Aunque el código personalizado no siempre es la mejor forma de mostrar u ocultar bloques, te proporcionamos algunos fragmentos de código a modo de ejemplo.
Plugins para mostrar u ocultar el contenido de los bloques en WordPress
Los plugins que examinamos tienen funciones similares, pero se implementan de formas diferentes. La mayoría incluyen ajustes globales en WP Admin > Ajustes, excepto los dos últimos plugins mencionados en la sección Otros Plugins, que no tienen estas opciones.
Sin embargo, todos ellos proporcionan controles de visibilidad por bloque en el panel Inspector (la barra lateral derecha) dentro del editor, tanto si trabajas con una página, una entrada, un tipo de entrada personalizado o el editor del sitio.
Block Visibility
Block Visibility es uno de los plugins más conocidos en este espacio. Ha estado disponible desde los primeros días del editor de bloques. Ofrece el conjunto de funcionalidades más completo con una interfaz de usuario (UI) intuitiva, y es completamente gratuito sin versión premium.
Puedes establecer controles de visibilidad en cualquier bloque en función de diferentes condiciones, ya sea de forma individual o combinada:
- Navegador y dispositivo – Muestra u oculta un bloque en función del navegador del visitante (Chrome, Firefox, Safari, etc.) o del tipo de dispositivo (ordenador de sobremesa, tableta, móvil).
- Cookie – Controla la visibilidad en función de si una cookie específica está presente en el navegador del usuario, útil para la personalización.
- Fecha y hora – Programa el contenido para que sea visible durante horas específicas o en determinadas fechas, como mostrar un mensaje sólo en horario laboral.
- Ocultar Bloque – Una anulación directa que oculta completamente un bloque, independientemente de cualquier otra condición.
- Ubicación – Muestra u oculta contenido en función de la ubicación geográfica del visitante (país, región o ciudad).
- Metadatos – Controla la visibilidad utilizando valores de metadatos personalizados, a menudo útiles para contenido dinámico en tipos de entrada personalizados.
- Cadena de consulta – Muestra u oculta bloques en función de parámetros de la URL (como mostrar un bloque sólo si
?promo=trueestá en la URL). - Fuente de referencia – Cambia la visibilidad en función de la procedencia del visitante (por ejemplo, ocultar una oferta especial si el usuario llegó desde Google).
- Tamaño de pantalla – Ajusta la visibilidad en función de la anchura de la pantalla, permitiendo un contenido diferente para usuarios de móvil, tableta o escritorio.
- Ruta URL – Muestra u oculta bloques en función de la URL de la página, útil para mostrar contenido sólo en páginas o secciones específicas del sitio.
- Rol de usuario – Restringe la visibilidad en función del rol del usuario conectado, por ejemplo para mostrar contenido exclusivo a administradores o miembros.
El plugin también incluye funciones adicionales para gestionar la visibilidad de los bloques:
- Ajustes predefinidos de visibilidad – Guarda y aplica ajustes predefinidos de visibilidad a varios bloques.
- Copiar e importar ajustes – Duplica fácilmente los ajustes de visibilidad en diferentes bloques.
Además, el botón Ocultar bloque a todos está disponible directamente en la barra de herramientas de bloques, lo que proporciona una forma rápida de ocultar completamente cualquier bloque.
Veamos dos ejemplos comunes de cómo se puede utilizar este plugin.
Fecha y hora
El plugin Block Visibility ofrece un control total sobre la programación del contenido en función de las condiciones de fecha y hora. Puedes establecer rangos de tiempo específicos, fechas o combinaciones de ambos.
Por ejemplo, queremos mostrar un encabezado cuando la tienda esté abierta y otro cuando esté cerrada:
- «Ahora Mismo, Nuestra Tienda Está Abierta» debe estar visible entre las 8 a. m. y las 5 p. m.
- «Ahora Estamos Cerrados» debe estar visible en el resto de horas.
Si es la primera vez, haz clic en el icono más (+) o en el menú de opciones de tres puntos para mostrar las opciones de control del plugin y selecciona Fecha y hora. Hazlo para ambos bloques de encabezamiento.
Aplica la condición 8 a.m. – 5 p.m. al encabezado «Ahora Mismo, Nuestra Tienda Está Abierta».
El encabezado «Ahora Estamos Cerrados» requiere dos conjuntos de datos para reflejar el cambio de día a medianoche.
La configuración resultante muestra los encabezados según lo establecido en la condición de visibilidad.
Fuente de referencias
Para este ejemplo, ocultamos un botón si la fuente de referencia contiene alguna parte de una URL determinada. Alternativamente, podíamos haber optado por mostrar el botón si la referencia contiene alguna parte de una URL determinada.
Por último, en Configuración > Visibilidad del bloque, encontrarás tres secciones principales:
- Configuración General
- Controles de Visibilidad
- Gestor de Bloques
Para disfrutar de la mejor experiencia, te recomendamos que actives el Modo de Control Total en los Ajustes Generales. Esto garantiza que los ajustes de visibilidad estén disponibles para cada bloque.
Algunos bloques, como el bloque Botón, requieren esta configuración porque los controles de visibilidad del plugin no están activados por defecto en el panel Inspector.
Content Control
No debe confundirse con el plugin Restrict Content, el plugin Content Control proporciona dos condiciones para ocultar o mostrar contenido.
- Reglas de dispositivo – Controla la visibilidad del bloque en función del tipo de dispositivo (ordenador de sobremesa, tableta o móvil).
- Reglas de usuario – Muestra un bloque en función de los roles de usuario, que pueden establecerse para usuarios conectados, usuarios desconectados, todos los roles, roles específicos o roles excluidos.
Estas reglas pueden utilizarse por separado o combinadas para crear condiciones de visibilidad flexibles. Por ejemplo, utilizamos las Reglas de Dispositivos para mostrar una imagen optimizada para diferentes tamaños de pantalla. La imagen más grande está configurada para aparecer sólo en ordenadores de sobremesa.
- A: En el editor de páginas, las vistas Móvil y Tableta están desactivadas.
- B: En el front end, la imagen tiene el tamaño correcto para ordenadores de sobremesa.
Además, la imagen optimizada para móviles está configurada para aparecer sólo en tabletas y dispositivos móviles.
- A: En el editor de páginas, la vista Escritorio está desactivada.
- B: En el front end, la imagen se muestra para tabletas y dispositivos móviles.
Esta configuración garantiza que los usuarios vean el tamaño de imagen más adecuado para su dispositivo, mejorando el rendimiento y la experiencia del usuario.
Además, cada bloque también incluye cuatro ajustes opcionales, accesibles a través del menú de opciones de tres puntos:
- Copiar – Copia la configuración del bloque.
- Pegar – Aplica los ajustes copiados a otro bloque.
- Restaurar valores por defecto – Restablece todas las condiciones de visibilidad del bloque.
- Desactivar Reglas de Dispositivo / Desactivar Reglas de Usuario – Desactiva temporalmente las condiciones de visibilidad sin borrarlas.
Te recomendamos encarecidamente que utilices las opciones Desactivar reglas de dispositivo o Desactivar reglas de usuario mientras pruebas el plugin. Esto facilita el restablecimiento y el ajuste de la configuración de visibilidad según sea necesario.
Dentro de WP Admin > Configuración, encontrarás varios ajustes globales para el plugin, como la definición de los breakpoints. Estos son los valores predeterminados para los tres dispositivos.
También puedes desactivar el plugin para cualquier bloque dentro de esta configuración. La versión premium de este plugin incluye estas y muchas otras funcionalidades:
- Programación de bloques – Establece condiciones de visibilidad basadas en el tiempo.
- Reglas de WooCommerce – Controla la visibilidad de los bloques en función de la configuración de WooCommerce.
- Reglas de Easy Digital Downloads – Restringe el contenido para los clientes de productos digitales.
- Reglas booleanas – Utiliza condiciones lógicas para la visibilidad de los bloques.
- Motor de reglas para bloques – Crea condiciones de visibilidad personalizadas con mayor flexibilidad.
Otros plugins
Además de las opciones más populares, hay dos plugins menos conocidos y con menos instalaciones activas que también proporcionan controles de visibilidad de bloques:
Conditional Blocks – Visibilidad avanzada del contenido
El plugin Conditional Blocks te permite controlar la visibilidad de los bloques de WordPress mediante una lógica avanzada, todo ello dentro de una sencilla interfaz modal. Puedes establecer condiciones para determinar cuándo y dónde debe ser visible un bloque.
La versión gratuita de Conditional Blocks incluye controles básicos de visibilidad, como:
- Bloquear bloque a todo el mundo – Oculta completamente un bloque.
- Visibilidad responsiva – Muestra u oculta bloques en función del tipo de dispositivo (móvil, tableta o escritorio).
- Condiciones de estado del usuario – La opción Usuario Conectado (usuarios que han iniciado sesión) muestra los bloques sólo para los usuarios conectados, mientras que la opción Usuario Desconectado (usuarios que no han iniciado sesión) muestra los bloques sólo para los usuarios desconectados.
- Lógica de condiciones AND/OR – Combina varias reglas para crear condiciones de visibilidad complejas.
La versión Pro amplía la funcionalidad con funcionalidades adicionales, entre las que se incluyen:
- Gestor de preajustes – Guarda grupos de reglas y aplícalos a varios bloques de tu sitio para una gestión eficaz.
- Breakpoints avanzados – Define tamaños de pantalla personalizados para diferentes dispositivos.
- Control de geolocalización – Muestra u oculta bloques en función de la ubicación del usuario (requiere una clave API).
- Configuración de la barra de herramientas – Gestiona las condiciones de visibilidad directamente desde la barra de herramientas de bloques.
- Visibilidad basada en roles de usuario – Restringe los bloques en función de los roles de usuario (como administradores, suscriptores, clientes).
- Opciones de programación – configura los bloques para que sólo aparezcan en determinados intervalos de fechas u horas.
- Integraciones con WooCommerce y Membresías – Controla la visibilidad en función del contenido del carrito, las membresías de los usuarios y mucho más.
Para quienes necesiten una mayor flexibilidad y una lógica condicional avanzada, la versión Pro proporciona un completo conjunto de herramientas para gestionar la visibilidad del contenido a escala.
Wicked Block Conditions
El plugin Wicked Block Conditions es un plugin gratuito que te permite ocultar o mostrar bloques en función de varios criterios:
- Estado de inicio de sesión del usuario – Mostrar u ocultar bloques en función de si un usuario ha iniciado sesión.
- Rol de usuario – Restringe la visibilidad en función de los roles de usuario.
- Fecha y hora – Programa el contenido para que aparezca o desaparezca a determinadas horas.
- Categorías o etiquetas de publicación – Muestra el contenido en función de la categoría o etiqueta asignada.
- Estado de la entrada – Controla la visibilidad en función de si una entrada está publicada, en borrador, pendiente, etc.
- Parámetro de cadena de consulta – Ajusta la visibilidad en función de los valores de la URL.
- Función PHP personalizada – Ejecuta lógica personalizada para un control avanzado de la visibilidad.
La posibilidad de utilizar funciones PHP personalizadas hace que este plugin sea especialmente útil para los desarrolladores que deseen añadir su propia lógica directamente en la interfaz de usuario.
Código personalizado para mostrar u ocultar el contenido del bloque
Si tienes un caso de uso sencillo y prefieres cargar solo lo necesario, puedes utilizar código personalizado en lugar de un plugin. Esto se puede hacer programando tu propio plugin o añadiendo funciones directamente a tu archivo functions.php.
A continuación hay tres ejemplos basados en PHP, pero si el rendimiento es una prioridad, JavaScript podría ser una mejor opción.
Ocultar contenido en función del estado de inicio de sesión del usuario
El siguiente ejemplo oculta todos los elementos de párrafo (<p>) cuando un usuario ha iniciado sesión:
add_action( 'wp_head', 'kinsta_toggle_paragraphs_visibility' );
function kinsta_toggle_paragraphs_visibility() {
if (is_user_logged_in() ) {
echo 'p { display: none !important; }';
}
}La función comprueba si un usuario ha iniciado sesión utilizando is_user_logged_in(). Si la condición es true (verdadera), inyecta CSS en la sección <head>, ocultando todos los elementos <p> utilizando display: none;. Aunque el marcado permanece en el código fuente de la página, no es visible para los usuarios.
Puedes modificar este comportamiento sustituyendo is_user_logged_in() por:
!is_user_logged_in()– Ocultar contenido cuando el usuario ha cerrado la sesión.is_user_logged_out()– Una función alternativa para detectar usuarios desconectados.
!is_user_logged_out()– Una forma alternativa de comprobar si el usuario está conectado.
Ocultar contenido en función de la geolocalización
Supongamos que deseas ocultar contenido para los usuarios de una ubicación determinada. No hay límite en lo que puedes mostrar u ocultar, pero aquí adoptamos un enfoque general y ocultamos todas las imágenes de los usuarios con sede en EE.UU.
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']no siempre es fiable y puede devolver IPs incorrectas.- Llamar a la API en cada carga de página puede afectar al rendimiento. Un mejor enfoque sería almacenar en caché la respuesta utilizando un transitorio de WordPress para almacenar los datos temporalmente.
Ocultar una imagen destacada por categoría
Ninguno de los plugins que examinamos tenía una forma de mostrar u ocultar los títulos de página o las imágenes destacadas, ya que no son bloques. Aquí, estamos ocultando la imagen destacada para todas las entradas cuya categoría sea libros.
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"
}Este filtro comprueba si la entrada pertenece a la categoría Libros utilizando has_category(). Si la condición es true, elimina la imagen destacada devolviendo una cadena vacía. En caso contrario, mantiene la imagen destacada sin cambios.
Probar tu implementación
Antes de desplegar el plugin o el código personalizado que hayas elegido, te recomendamos que lo pruebes a fondo para evitar problemas imprevistos, como restringir el contenido al público al que va dirigido. Aquí tienes algunos pasos clave para las pruebas:
- Asegurar la compatibilidad – Verifica que el plugin o código personalizado funciona sin problemas, especialmente con plugins de bloqueo de terceros.
- Revisa la salida del código fuente – Algunos métodos ocultan el contenido mediante CSS, mientras que otros lo eliminan por completo del marcado. Considera cómo afecta cada enfoque al SEO antes de tomar una decisión.
- Utiliza un entorno Staging – Kinsta proporciona entornos staging de WordPress para todas las cuentas, lo que te permite probar los cambios de forma segura antes de aplicarlos a un sitio en producción.
Resumen
Controlar la visibilidad del contenido es una herramienta esencial para la gestión de sitios de WordPress. El enfoque que elijas, ya sea un plugin estándar o un código personalizado, depende de tus necesidades específicas y de tus conocimientos técnicos.
Si quieres un alojamiento que te facilite el desarrollo, la prueba de plugins y la seguridad de tu sitio, prueba Kinsta.
Las vulnerabilidades de seguridad pueden ser una preocupación real, pero con Kinsta obtienes un escaneado automático de malware cada tres minutos, cortafuegos de nivel empresarial y una plataforma optimizada para la velocidad y la fiabilidad. Empieza a utilizar Kinsta hoy mismo.
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.
