Cover Block sin Full Width en Blocksy: cómo resolverlo

Si el bloque de portada de WordPress con ancho completo no te aparece en el editor Gutenberg con el tema Blocksy, no es un bug tuyo ni de WordPress: es casi siempre un problema de estructura de bloques o de configuración del tema que tiene solución en menos de cinco minutos.

¿Qué es el bloque de portada y para qué se usa?

El bloque de portada de WordPress (Cover Block) es un bloque de Gutenberg que muestra una imagen o video de fondo con contenido superpuesto. Está pensado para hero sections, banners, separadores visuales y encabezados de sección. Cualquiera que haya armado una landing page con el editor nativo lo usó al menos una vez.

Lo que lo hace útil para heroes y portadas es precisamente su capacidad de romperse del contenedor de contenido y ocupar todo el ancho de la ventana. Para eso, Gutenberg ofrece tres niveles de alineación:

• Ninguna: el bloque respeta el ancho del contenedor de texto
• Ancho amplio (Wide): el bloque sale un poco más del contenedor central, pero no llega al borde
• Ancho completo (Full Width): el bloque ocupa el 100% del viewport, de borde a borde

El problema es que esta tercera opción a veces sencillamente no aparece en la barra de herramientas del bloque. Y cuando eso pasa, hay razones concretas.

Por qué no aparece la opción de ancho completo

Hay cuatro causas reales. No son hipótesis: son los casos que se repiten en los foros de soporte de WordPress.org y en issues de Gutenberg en GitHub.

El tema no declara soporte para alineaciones extendidas

Para que Gutenberg muestre las opciones Wide y Full Width, el tema tiene que declararlo explícitamente. Sin esta línea en el functions.php del tema (o en su equivalente moderno), las opciones no aparecen para ningún bloque: Sobre eso hablamos en consultá en los foros de wp-community.

add_theme_support( 'align-wide' );

Blocksy lo tiene activado por defecto, así que si usás Blocksy puro (sin un tema hijo que pise esa declaración), este no es tu problema. Pero si heredaste un tema hijo o instalaste un starter theme de terceros encima de Blocksy, chequealo.

El bloque está anidado dentro de un contenedor restrictivo

Esta es la causa más común. Ponele que arrastrás el Cover Block dentro de un bloque Group para organizarlo mejor. El bloque Group tiene una opción llamada «Los bloques internos usan el ancho del contenido» (Inner blocks use content width). Cuando esa opción está activada, todos los bloques hijos quedan limitados al ancho del contenedor y las opciones de alineación extendida desaparecen de la barra de herramientas.

¿Y qué pasó cuando lo probaron con bloques Columns, otro Cover como contenedor padre o un bloque Query? Exacto, lo mismo. Cualquier bloque contenedor con esa configuración activa va a ocultar la opción Full Width de sus hijos.

CSS personalizado que pisa el ancho

Si usás CSS adicional en el personalizador o en un plugin de custom CSS, un selector como .wp-block-post-content > * con max-width puede estar limitando todos los bloques hijos del contenido, incluso cuando Gutenberg ya les asignó la clase alignfull. El bloque tiene la clase correcta, pero el CSS del tema o del usuario lo frena.

Configuración de layout en Blocksy

Blocksy tiene su propio sistema de layout a nivel de tema. Si el template de página está configurado en modo «Boxed» (con padding lateral en el contenedor), eso puede generar conflictos visuales o directamente ocultar la opción, dependiendo de la versión del tema.

El problema del bloque padre: el detalle que nadie lee

Vale la pena detenerse acá porque este es el escenario que genera más confusión. La opción «Los bloques internos usan el ancho del contenido» existe en los bloques Group, Cover (cuando lo usás como contenedor), y algunos bloques de terceros. Aparece como un toggle en el panel lateral derecho cuando seleccionás el bloque padre. Esto se conecta con lo que analizamos en para personalizaciones avanzadas del tema.

Cuando está activada, el bloque padre le comunica a sus hijos que deben respetar su ancho. Gutenberg procesa esto y directamente elimina las opciones de alineación extendida de la barra del bloque hijo (no las deshabilita visualmente, las saca del DOM). Por eso no ves ni Wide ni Full Width, ni siquiera en gris.

Según el issue #37036 en el repositorio de Gutenberg, este comportamiento fue debatido bastante en el equipo de WordPress: hay desarrolladores que lo consideran correcto (respetar la cascada de ancho) y otros que lo ven como una limitación confusa para el usuario final (que no entiende por qué desapareció la opción). La discusión continúa siendo un punto de análisis en la comunidad hasta mayo de 2026.

Solución 1: verificar soporte del tema

Si usás un tema hijo de Blocksy, abrí el functions.php de ese tema hijo y buscá si hay algo que llame a remove_theme_support('align-wide'). También podés revisar si el tema hijo registra su propio theme.json que restrinja los layouts disponibles.

Para verificar rápido sin tocar código: instalá un plugin como Health Check & Troubleshooting, activá el modo seguro con tu usuario, y probá en una página si la opción aparece con el tema padre activo. Si aparece en modo seguro y no en producción, el conflicto está en el tema hijo o en un plugin.

La documentación oficial de Blocksy confirma que el tema soporta align-wide de forma nativa desde sus primeras versiones, así que Blocksy en sí no es el problema.

Solución 2: revisar la estructura de bloques anidados

Esta es la solución para el caso más frecuente. Seguí estos pasos:

• Abrí la vista de lista (List View) desde el menú superior del editor: ícono con tres líneas horizontales, o con el atajo Ctrl+Alt+O en Windows.
• Buscá el Cover Block en el árbol de bloques. Si está indentado debajo de un Group, Columns u otro bloque contenedor, ese es el problema.
• Seleccioná el bloque padre (Group, por ejemplo) y en el panel derecho, buscá la opción «Los bloques internos usan el ancho del contenido». Desactivala.
• Si desactivar esa opción rompe el layout del contenedor, la alternativa es sacar el Cover Block de ese contenedor y posicionarlo fuera, directamente en el nivel raíz de la página.

Mover un bloque en Gutenberg es tan simple como arrastrarlo en la List View. Seleccioná el Cover, cortalo (Ctrl+X), hacé clic fuera del contenedor en la posición donde querés pegarlo, y pegalo (Ctrl+V).

Solución 3: identificar CSS conflictivo

Abrí el inspector del navegador (F12), seleccioná el Cover Block en la página publicada y buscá si alguna regla CSS está forzando un max-width sobre el elemento o sus padres. Los selectores más problemáticos suelen ser:

• .entry-content > * con max-width: 800px o similar
• .wp-block-post-content con padding-inline agresivo
• .site-content .container si el tema tiene su propia estructura de containers

Si encontrás el selector conflictivo, podés neutralizarlo en el CSS adicional del personalizador de Blocksy con algo como: En al crear landing pages con ancho completo profundizamos sobre esto.

.wp-block-cover.alignfull { max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }

Eso sí: esto es un parche. Si necesitás llegar ahí, conviene revisar qué está generando el max-width en primer lugar.

Configuración específica de Blocksy que hay que conocer

Blocksy tiene opciones de layout en su panel de Personalización (Apariencia > Personalizar > General). Las más relevantes para este problema:

Opción en Blocksy	Dónde está	Qué hace
Container Width	Personalizar > General > Layout	Define el ancho máximo del contenedor central (default: 1290px)
Content Edge Spacing	Personalizar > General	Padding lateral del contenido; si es alto puede «comer» el full width visual
Layout tipo «Boxed» vs «Wide»	Por template de página en Blocksy	Boxed agrega padding externo al contenedor completo de la página

Según el tutorial oficial de Blocksy sobre Full Width con Gutenberg, para que un bloque con alignfull funcione correctamente, el template de la página debe estar en layout «Wide» o «Full Width» a nivel de tema, no solo en el bloque individual. Si el template dice «Boxed», el Cover puede tener la clase alignfull y aun así verse recortado.

La variable CSS --theme-container-width que expone Blocksy te permite ajustar el ancho del contenedor desde CSS sin tocar PHP, lo cual es útil si querés que una sección específica use más ancho sin cambiar el layout global.

Casos de uso reales para el Cover Block a ancho completo

Una vez que lo resolvés, el Cover Block a full width abre bastantes posibilidades concretas:

• Hero section con imagen de fondo: imagen de 1920x600px mínimo, overlay al 40-50% para legibilidad del texto, altura mínima 400px o directamente 100vh para pantalla completa
• Sección de llamada a la acción (CTA): fondo de color sólido de marca, texto centrado, botón, sin imagen pesada
• Separadores visuales entre secciones: Cover con height fijo (200-300px), imagen o color, sin contenido interno
• Banners promocionales: imagen de campaña a full width con texto superpuesto y link

Para imágenes de fondo, las dimensiones que funcionan sin pixelarse en pantallas 4K son 1920x800px como mínimo para heros, y 1920x400px para separadores. El peso ideal es bajo los 200KB (usá WebP). Si tu hosting no tiene conversión automática a WebP, el hosting WordPress de Donweb incluye optimización de imágenes con soporte WebP en sus planes, lo cual ahorra trabajo de configuración.

Qué está confirmado / Qué no

Confirmado:

• Blocksy sí soporta alignfull de forma nativa, confirmado en su documentación oficial.
• Los bloques contenedores con «Inner blocks use content width» activo sí ocultan las opciones de alineación extendida en los bloques hijos (comportamiento documentado en Gutenberg).
• El issue #37036 de Gutenberg sobre este comportamiento sigue siendo un punto de debate en la comunidad WordPress.
• El selector CSS de la variable --theme-container-width de Blocksy es controlable desde CSS adicional.

No confirmado / depende de la versión:

• El comportamiento exacto puede variar entre versiones de Blocksy (el tema actualiza frecuentemente). Antes de aplicar workarounds de CSS, chequeá la versión que tenés instalada.
• Algunos usuarios reportan que en Blocksy con ciertos page templates, la opción Full Width aparece o desaparece sin razón aparente entre versiones del tema. Actualizá siempre a la última versión estable antes de diagnosticar.

Errores comunes

Error 1: Buscar el problema en el Cover Block cuando está en el bloque padre. La opción de alineación desaparece del hijo cuando el padre la restringe. Si inspeccionás solo el Cover Block sin mirar el contenedor que lo rodea, nunca vas a encontrar la causa. Te puede servir nuestra cobertura de probá antes en un entorno de prueba.

Error 2: Agregar CSS de workaround antes de diagnosticar. Mucha gente copia el truco de margin-left: calc(50% - 50vw) antes de verificar si el problema es estructural. Ese CSS solo enmascara el síntoma; si el bloque está anidado en un contenedor restringido, el CSS puede romperse en mobile o en páginas con otro layout.

Error 3: Cambiar el tema completo pensando que Blocksy no soporta Full Width. Blocksy sí lo soporta. El 90% de los casos reportados en el foro de soporte de wordpress.org tienen solución sin cambiar de tema, simplemente ajustando la estructura de bloques o la configuración de layout del template.

Preguntas Frecuentes

¿Por qué no aparece la opción de ancho completo en el bloque de portada?

Hay dos causas principales: el bloque está anidado dentro de un contenedor (Group, Columns, otro Cover) que tiene activa la opción «Los bloques internos usan el ancho del contenido», o el tema no declaró soporte para align-wide. Con Blocksy puro, casi siempre es la primera causa. Revisá la List View del editor para ver si el Cover Block tiene un bloque padre que lo esté restringiendo.

¿Cómo hacer que el Cover Block ocupe todo el ancho de la página en Blocksy?

Primero asegurate de que el bloque esté en el nivel raíz del editor (sin contenedor padre). Después seleccioná el bloque y en la barra de herramientas superior buscá el ícono de alineación: aparecen las opciones Ninguna, Wide y Full Width. Elegí Full Width. Si el template de la página en Blocksy está en modo «Boxed», cambialo a «Wide» en los metadatos de la página o en Personalizar > General > Layout.

¿Qué hacer si el bloque de portada no acepta la alineación Full Width aunque la seleccione?

Si la opción aparece pero el bloque visualmente no ocupa todo el ancho, el problema es CSS. Abrí el inspector del navegador y buscá selectores como .entry-content > * o .wp-block-post-content con max-width definido. Podés neutralizarlo con .wp-block-cover.alignfull { max-width: 100%; } en el CSS adicional de Blocksy, aunque es mejor encontrar el origen del max-width conflictivo.

¿Por qué desaparece la opción de alineación cuando anido bloques en WordPress?

Es un comportamiento intencional de Gutenberg: cuando un bloque contenedor tiene activa la opción «Inner blocks use content width», comunica a sus hijos que deben limitarse al ancho del contenido. Gutenberg responde ocultando las opciones Wide y Full Width del bloque hijo (no las muestra en gris, directamente no las renderiza). La solución es desactivar esa opción en el bloque padre o sacar el Cover Block del contenedor.

¿Cómo configurar una hero section a pantalla completa con Blocksy y Gutenberg?

Insertá un Cover Block directamente en el editor (sin contenedor padre), seteá la alineación en Full Width, y en las opciones del bloque en el panel derecho configurá la altura mínima en 100vh para que ocupe toda la pantalla. Usá una imagen de fondo de al menos 1920x800px en formato WebP. El overlay (color de superposición) entre 30% y 50% de opacidad mantiene la legibilidad del texto sobre la imagen.

Conclusión

El bloque de portada WordPress ancho completo desaparece casi siempre por la misma razón: el bloque está adentro de un contenedor que lo restringe, o el template de Blocksy está en modo Boxed. No es un bug del tema ni de Gutenberg, es un comportamiento de diseño que confunde porque no se comunica bien en la UI del editor (spoiler: ocultar una opción sin explicar por qué no es la mejor UX).

El diagnóstico toma cinco minutos: abrís la List View, ves si el Cover tiene un padre, desactivás la opción del bloque padre o lo sacás del contenedor. Si después de eso el problema sigue, revisás el CSS y el template de la página en Blocksy. Sin atajos raros ni plugins adicionales.

Lo que sí está confirmado es que Blocksy, cuando está bien configurado, soporta alignfull sin problemas. El tema no es el problema. La estructura de bloques, casi siempre, sí lo es.

Fuentes

• Creative Themes – Tutorial Full Width con Gutenberg en Blocksy
• WordPress.org Support – Cover isn’t full width
• GitHub Gutenberg Issue #37036 – Inner blocks content width
• AyudaWP – Ancho amplio y completo en bloques Gutenberg
• Creative Themes – Documentación opciones generales de Blocksy