Cómo agregar o eliminar espacios en blanco entre bloques de WordPress

Agregar o eliminar espacios en blanco entre sus bloques de WordPress le brinda más control sobre el diseño de su sitio de WordPress.

En este artículo, le mostraremos cómo agregar o eliminar espacios en blanco entre los bloques de WordPress, paso a paso.

¿Por qué agregar o eliminar espacios en blanco entre los bloques de WordPress?

WordPress facilita la creación de páginas y publicaciones personalizadas con el editor de bloques de WordPress incorporado.

Sin embargo, puede notar que cuando agrega ciertos bloques, hay demasiado o muy poco espacio. Al agregar o eliminar espacios en blanco entre sus bloques de WordPress, puede crear diseños de página personalizados exactamente como lo desea.

Con más control sobre el diseño final de su sitio web de WordPress, puede ofrecer a sus visitantes una mejor experiencia de usuario.

Dicho esto, echemos un vistazo a cómo agregar o eliminar espacios en blanco entre los bloques de WordPress en su sitio web. Simplemente use los enlaces rápidos a continuación para saltar directamente al método que desea usar.

Método 1. Agregar espacio en blanco entre bloques de WordPress con Block Editor

La forma más fácil de agregar espacios en blanco entre sus bloques es usando el editor de bloques de WordPress. Hay un bloque de espaciado incorporado que le permite agregar un espacio en blanco con un par de clics.

Para usar esto, abra la publicación o página que desea editar y haga clic en el botón Agregar bloque ‘Más’.

Luego, busque ‘Espaciador’ y seleccione el bloque.

Esto insertará automáticamente un espaciador en la página.

Puedes hacerlo más grande o más pequeño arrastrando el bloque hacia arriba o hacia abajo.

Una vez que haya terminado, haga clic en el botón ‘Actualizar’ para guardar los cambios.

Tenga en cuenta que este método solo le permite agregar espacio entre bloques. Para eliminar espacio, deberá usar uno de los otros métodos a continuación.

Método 2. Agregar o eliminar espacios en blanco entre bloques de WordPress agregando CSS personalizado

Otra forma de agregar y eliminar espacios en blanco entre sus bloques es agregar un código CSS personalizado a su tema.

Si no lo ha hecho antes, le recomendamos que eche un vistazo a nuestra guía sobre cómo agregar fácilmente CSS personalizado a su sitio de WordPress antes de comenzar.

Luego, abra la página o publicación que desea editar y luego haga clic en el bloque donde desea agregar o eliminar el espacio en blanco.

Luego, haga clic en el elemento de menú ‘Bloquear’ en el panel de opciones de la derecha.

Después de eso, desplácese hacia abajo hasta el menú desplegable ‘Avanzado’ y haga clic en él. Esto abre un conjunto de opciones adicionales para ese bloque.

Luego, en el cuadro ‘Clases CSS adicionales’, agregue el siguiente código:

Este fragmento crea una nueva clase CSS específicamente para ese bloque.

Después de eso, haga clic en el botón ‘Actualizar’ para guardar los cambios.

A continuación, navegue hasta Apariencia » Personalizar para abrir el personalizador de temas de WordPress.

Luego, desplácese hacia abajo y haga clic en la opción de menú ‘CSS adicional’.

Esto abre un campo donde puede agregar código CSS.

A continuación, pegue el siguiente fragmento de código en el cuadro.

.add-remove-bottom-space {

 margin-bottom: 0;

}

Este fragmento de código establece el margen inferior en cero y eliminará el espacio en blanco del bloque. Si desea agregar espacio en la parte inferior, simplemente cambie el ‘0’ a algo como ’20px’.

Una vez que haya realizado sus cambios, asegúrese de hacer clic en el botón ‘Publicar’ para que sus cambios estén activos.

Guardar código CSS personalizado usando un complemento

Al agregar CSS personalizado al personalizador de temas de WordPress, solo se guardará para el tema que está usando actualmente. Si cambia el tema de WordPress, deberá copiar el código CSS en su nuevo tema.

Si desea que su CSS personalizado se aplique sin importar el tema que esté usando, deberá usar el CSS personalizado simple plugin.

Lo primero que debe hacer es instalar y activar el plugin. Para más detalles, consulta nuestra guía sobre cómo instalar un WordPress plugin.

Tras la activación, simplemente vaya a Apariencia » CSS personalizado y agrega tu código CSS personalizado.

Cuando haya terminado, haga clic en el botón ‘Actualizar CSS personalizado’ para guardar los cambios.

Método 3. Agregar o eliminar espacios en blanco entre bloques de WordPress con CSS Hero

Otra forma amigable para principiantes de agregar o eliminar espacios en blanco entre los bloques de WordPress es mediante el uso de un CSS personalizado de WordPress. plugin. Esto le permite realizar cambios visuales en su blog de WordPress sin editar ningún código CSS.

Recomendamos usar CSS Hero plugin. Le permite editar casi todos los estilos CSS en su sitio de WordPress sin escribir una sola línea de código.

Trato: Los lectores de pueden obtener un 34% de descuento utilizando nuestro código de cupón CSS Hero.

Lo primero que debe hacer es instalar y activar el plugin. Para obtener más detalles, consulte nuestra guía para principiantes sobre cómo instalar un WordPress plugin.

Tras la activación, debe hacer clic en el botón ‘Continuar con la activación del producto’ para activar el plugin. Encontrará el botón directamente encima de su lista de instalados plugins.

Esto lo lleva a una pantalla donde debe ingresar su nombre de usuario y contraseña. Luego, siga las instrucciones en pantalla y será redirigido a su tablero una vez que se verifique su cuenta.

A continuación, debe abrir la página o publicación que desea editar, luego hacer clic en el botón ‘CSS Hero’ en la parte superior de la barra de herramientas de administración de WordPress.

Esto abrirá la misma página con CSS Hero ejecutándose encima. los plugin utiliza un editor visual, por lo que podrá realizar sus cambios en tiempo real.

Cuando hace clic en cualquier elemento de su página, aparecerá una barra de herramientas en el lado izquierdo de la página para que pueda realizar personalizaciones.

Para eliminar o agregar un espacio en blanco entre sus bloques, simplemente haga clic en la opción ‘Espacios’ y luego desplácese hacia abajo hasta la sección ‘Margen inferior’.

Aquí puede mover el control deslizante hacia arriba o hacia abajo para agregar o eliminar espacios en blanco.

Cualquier cambio que realice aparecerá automáticamente en su página.

Una vez que haya terminado de hacer los cambios, debe hacer clic en el botón ‘Guardar’ para que sus cambios estén activos.

Método 4. Agregar o eliminar espacios en blanco entre bloques de WordPress con SeedProd

Producto de semilla es el mejor generador de páginas de arrastrar y soltar utilizado por más de 1 millón de sitios web.

Puede usar la biblioteca de más de 150 plantillas para crear páginas 404 personalizadas, páginas de ventas, páginas de destino y mucho más. SeedProd incluso se puede usar para crear un tema de WordPress personalizado sin escribir ningún código.

Con el generador de arrastrar y soltar, tiene control total sobre el diseño de su sitio y puede eliminar o agregar espacio fácilmente a cualquier elemento del sitio web.

Para obtener más información, consulte nuestra guía sobre cómo crear una página personalizada en WordPress.

Mientras personaliza su página, puede agregar espacio en cualquier lugar usando el bloque espaciador.

Simplemente arrástrelo y suéltelo en cualquier lugar de la página donde desee agregar más espacio entre bloques.

Luego puede usar el control deslizante para ajustar su altura.

También puede controlar el espacio entre cualquier bloque. Para hacer eso, simplemente haga clic en cualquier bloque al que desee agregar o quitar espacio.

Esto abre el panel de opciones a la izquierda. Luego, haga clic en la pestaña ‘Avanzado’.

A continuación, desplácese hacia abajo hasta el menú desplegable ‘Espaciado’ y haga clic en él.

Esto abre un menú donde puede controlar el ‘Margen’. Simplemente ingrese un número en el cuadro del margen inferior para agregar espacio, o elimine el número para eliminar cualquier espacio en blanco existente.

Una vez que haya terminado de hacer los cambios, haga clic en el botón ‘Guardar’ y seleccione el menú desplegable ‘Publicar’ para hacer que sus cambios estén activos.

Esperamos que este artículo le haya ayudado a aprender cómo agregar o eliminar espacios en blanco entre los bloques de WordPress. Es posible que también desee ver nuestra guía sobre cómo iniciar su propio podcast y nuestra selección de expertos del mejor alojamiento web gratuito comparado.

Si te ha gustado este artículo, suscríbete a nuestro Canal de Youtube para tutoriales en vídeo de WordPress. También puedes encontrarnos en Twitter y Facebook.