Cómo encontrar y usar bloques anidados en WordPress

Publicado: 2023-06-23


¿Quieres saber cómo elegir y usar bloques anidados en WordPress?

El aspecto de bloques anidados de WordPress Gutenberg le permite agregar muchos bloques dentro de solo un bloque madre o padre. Luego, puede personalizar elementos de bloque distintos al mismo tiempo, organizar el contenido del artículo de manera eficiente y obtener mucha más adaptabilidad de la estructura.

En este artículo, le mostraremos cómo elegir y usar bloques anidados de WordPress sin esfuerzo.

Select and use nested blocks in WordPress

¿Qué son los bloques anidados de WordPress?

La función de bloque anidado de WordPress Gutenberg le permite insertar (o 'anidar') uno o más bloques dentro de otro bloque.

Los bloques anidados lo ayudan a crear diseños mucho más avanzados en su página de WordPress agregando varios bloques uno dentro del otro. Esto permite mucha más adaptabilidad al crear y formatear contenido para páginas y publicaciones de Internet.

Por ejemplo, puede anidar varios bloques gráficos en un bloque de equipo para exhibir un conjunto de tomas de un evento distinto o una colección de obras de arte realizadas con una técnica particular.

Preview of WordPress nested blocks

Además, la característica de bloque anidado le permite editar bloques de personas particulares individualmente. Esto generalmente significa que puede personalizar cada bloque de acuerdo con sus deseos sin afectar a los otros bloques. A su vez, esto beneficia a una mejor organización del material, puede hacer que sus datos sean más atractivos y agiliza el método de generación de artículos.

Dicho esto, veamos cómo puede elegir y usar fácilmente los bloques anidados de WordPress Gutenberg.

Cómo usar bloques anidados de WordPress

Puede anidar convenientemente varios bloques utilizando el bloque Equipo o Columnas en el editor de bloques de Gutenberg.

Primero, debe abrir una publicación actual o nueva en el editor de bloques desde la barra lateral de administración de WordPress.

De la lista aquí, simplemente haga clic en el botón '+' en la esquina superior izquierda de la pantalla y obtenga el bloque 'Grupo'. Al hacer clic en él e incluirlo en la página web, deberá elegir un formato para los bloques que anidará entre sí.

Para este tutorial, decidiremos el formato de 'Grupo'.

Select Group block from the block menu

Próximamente, simplemente haga clic en el botón '+' en el monitor para comenzar a incluir artículos en el bloque de mamá o papá.

Por el bien de este tutorial, agregaremos un bloque gráfico.

Add an image block within the Group block

Al incluir el bloque Gráfico, simplemente haga clic en el botón 'Grupo' en la barra de herramientas del bloque en la parte superior para elegir el bloque guardián.

A continuación, debe simplemente hacer clic en el botón '+' para abrir el menú de bloques, desde donde puede decidir qué otros bloques agregar.

Open the block menu to add another block within the Group block

Cómo configurar las configuraciones de bloques anidados de WordPress

En el momento en que haya anidado varios bloques, puede configurar sus opciones de personas particulares haciendo clic en todos y cada uno de los bloques. Esto abrirá las configuraciones de bloque en la columna correcta de la pantalla.

Desde este artículo, puede cambiar el color del historial, el color del contenido del texto y el tamaño de los bloques personales sin afectar a los otros bloques que están anidados dentro de él.

Configure the individual block settings

Para configurar las configuraciones de todos los bloques anidados entre sí, simplemente deberá hacer clic en el botón 'Grupo' en la barra de herramientas de bloques en la parte superior. Esto abrirá la configuración del bloque padre o madre en la columna de la derecha.

Ahora puede configurar la justificación, la orientación, el tono del historial, el color del texto y la tipografía de todos los bloques anidados.

Tenga en cuenta que estas configuraciones tendrán un impacto en todos los bloques anidados dentro del bloque papá o mamá.

Configure the settings of the Group block

También puede convertir un bloque específico actual en bloques anidados haciendo clic en el botón 'Opciones' en la barra de herramientas mejor calificada de cualquier bloque.

Esto abrirá un mensaje de menú, exactamente donde debe elegir la opción 'Crear bloque reutilizable'.

Choose the Create Reusable Block option

Una vez que haya logrado eso, se diseñará un nuevo bloque reutilizable exactamente donde puede incluir varios bloques.

Una vez que haya terminado, no olvide hacer clic en el botón 'Publicar' o 'Actualizar' para ayudarlo a guardar sus modificaciones.

Create nested blocks

En nuestro ejemplo, hemos anidado un bloque de Título, Gráfico y Párrafo dentro de un bloque de Grupo. Así es como se veían los bloques anidados en nuestra página web de demostración.

Preview of WordPress nested blocks

Bonificación: use el complemento Wayfinder para encontrar rápidamente bloques anidados

A menudo, puede ser complicado elegir un bloque personal y configurarlo cuando hay varios bloques anidados.

Afortunadamente, el complemento Wayfinder hará que sea muy fácil encontrar bloques anidados de un bloque de mamá o papá e incluso le dice el tipo y la clase de los bloques.

Primero, deberá instalar y activar el complemento Wayfinder. Para obtener más recomendaciones, puede consultar nuestra guía sobre cómo instalar un complemento de WordPress.

En la activación, diríjase a la página Opciones » Wayfinder desde la barra lateral de administración de WordPress.

En el momento en que esté allí, todas las configuraciones ahora estarán activadas. Solo necesita desmarcar la casilla junto a la configuración que realmente no desea usar.

Por ejemplo, si desea que Wayfinder muestre los tipos de bloque de pantalla para todos los bloques en el editor, mantenga la casilla marcada después de la solución 'Mostrar tipo de bloque'.

Configure the Wayfinder plugin settings

Aun así, si realmente no desea que el complemento filtre las clases de bloqueo, simplemente desmarque la casilla hasta llegar a esa alternativa.

Inmediatamente después de configurar las opciones, no olvide hacer clic en el botón 'Guardar cambios'.

En el futuro, debe abrir un envío existente o nuevo desde la barra lateral de administración de WordPress.

Cuando esté allí, al pasar el mouse sobre cualquier bloque, se mostrará claramente una definición con su nombre. También podrá ver la definición e identificación de cualquier bloque anidado dentro del bloque de mamá o papá.

GIF for the Wayfinder plugin

Esto le permitirá reconocer todos los diversos bloques que están anidados dentro de un bloque de Equipo o Columnas.

Desde este artículo, puede encontrar convenientemente un bloque individual del bloque madre o padre para configurar sus opciones.

Use Wayfinder plugin to easily select a block

También puede encontrar todos los bloques anidados al mismo tiempo simplemente haciendo clic en el encabezado 'Columnas' o 'Grupo'. Esto abrirá la configuración del bloqueo de guardián en la columna correspondiente.

Tan pronto como haya configurado las configuraciones de bloque, simplemente haga clic en el botón 'Actualizar' o 'Publicar' para ayudarlo a guardar sus modificaciones.

Click the Group block outline to open its settings

Esperamos que este breve artículo lo haya ayudado a comprender cómo seleccionar y usar bloques anidados de WordPress. Es posible que también desee ver nuestro tutorial sobre cómo modificar la parte superior y el ancho del bloque en WordPress y nuestras principales selecciones para los complementos de WordPress imprescindibles para ayudar a mejorar su sitio.

Si prefiere este informe, asegúrese de suscribirse a nuestro canal de YouTube para obtener tutoriales de películas de WordPress. También puede encontrarnos en Twitter y Facebook.