Gutenberg Blocks: guía de usuario definitiva con consideraciones esenciales para 2022

Con el nuevo lanzamiento del 6 de diciembre de 2018, WordPress 5.0 Kirk introdujo un editor de bloques predeterminado, también conocido como Gutenberg. Este nuevo editor de contenido te ayuda a crear contenido con un enfoque completamente diferente. Reemplazó al editor WordPress TinyMCE y brinda una forma más visual para la creación de contenido en forma de bloques.

Gutenberg Editor proporciona una rica biblioteca de elementos o bloques prediseñados. Y puede usarlos mientras trabaja en un sitio de WordPress. Allí, cada pieza de contenido es un bloque que se puede arrastrar. Y estos bloques son los bloques del editor que se utilizan para crear diseños de contenido.

Ya sea que haya actualizado su sitio a WordPress 5.0 o no, debe aprender a usar Gutenberg Block para su futuro avance. Aquí obtendrá una idea completa y una lista de todos los bloques de WordPress de Gutenberg junto con los populares bloques de treinta partes.

WordPress Gutenberg Blocks: tu mejor compañero para el futuro

Los bloques de Gutenberg definitivamente hacen que el proceso de creación de contenido sea más optimizado e inteligente. Una vez que se habitúe a este editor, minimizará notablemente el tiempo de desarrollo de su sitio.

En pocas palabras, Gutenberg es un nuevo editor de estilo de bloque para la plataforma WordPress. Ha cambiado gradualmente la forma en que crea publicaciones, páginas, productos y casi todo en su sitio.

De hecho, puede manejar todo tipo de componentes de una manera más organizada con Gutenberg. Tales como texto, imagen, video, tabla y otros. Si es nuevo en Gutenberg Editor, realice un recorrido por esta guía para principiantes para obtener consejos y trucos útiles.

Nota: La vista frontal de los bloques depende en gran medida del tema que esté utilizando en su sitio.

Bloques predeterminados de Gutenberg en WordPress

Para estar preparado para el futuro, debe conocer los nombres predeterminados de los bloques de Gutenberg y sus usos. Como usuario de WordPress, es probable que tarde o temprano necesite que le presenten estos bloques.

Entonces, básicamente, los bloques de Gutenberg están organizados por las siguientes categorías:

• Más usado
• Bloques comunes
• Formateo
• Disposición
• Widgets
• incrustaciones
• reutilizable

Al hacer clic en el ícono “+” más, puede agregar un nuevo bloque en su sitio. En la parte superior de la lista, encontrará los bloques más utilizados. Aquellos bloques que usas con más frecuencia en tu sitio aparecerán aquí.

Debajo de eso, los bloques se agrupan por categoría. Haga clic en un título para descubrir los bloques.

Además, desde el panel de edición de la derecha, puede establecer el tamaño de fuente, la letra capitular, cambiar el texto y los colores de fondo para un bloque en particular.

¡Veamos cómo funcionan realmente!

Bloques comunes: utilizados regularmente en cualquier publicación

Estos son los bloques más comunes que cualquier persona necesita para sus publicaciones, incluidos texto e imagen. Necesita estos elementos básicos para personalizar una página o publicación en su sitio.

1. Párrafo: bloque simple de solo texto para agregar un solo párrafo de contenido.
2. Imagen : inserte una sola imagen en cualquier lugar de su publicación
3. Encabezado : Agregar etiqueta de encabezado
4. Galería : muestra un grupo de imágenes en un estilo de galería
5. Lista : agregar listas numeradas o con viñetas
6. Cita : incluye una cita en 2 estilos diferentes
7. Audio : Cargar un archivo de audio en su sitio
8. Portada : inserte un archivo de video o audio con superposición de texto
9. Archivo : agregue un enlace a un archivo descargable
10. Video : Cargue un archivo de video y reprodúzcalo directamente en su sitio

Formato: opciones de personalización adicionales

Estos bloques se utilizan para agregar algunas opciones de formato adicionales para su contenido, como código, verso y otros tipos de texto que necesitan un formato especial.

1. Código: Escriba cualquier tipo de código técnico con facilidad
2. Clásico: proporciona herramientas de edición del editor clásico de WordPress
3. HTML personalizado: inserte código HTML personalizado y obtenga una vista previa directamente en el editor de WordPress
4. Preformateado: agregue texto que respete el espaciado y las tabulaciones
5. Pullquote: agregue un énfasis visual especial a una cita de su texto
6. Tabla: use la tabla para mostrar datos tabulares
7. Verso: Escribe poesía y otras expresiones literarias incluyendo todos los espacios y saltos de línea.

Elementos de diseño: mejora el estilo de diseño

Estos bloques te ayudan a representar los contenidos del sitio de una manera atractiva. Hace que su sitio sea más atractivo para sus visitantes.

1. Botón: cree un botón e inserte un enlace con un fondo y un color de texto diferentes
2. Columnas: cree diseños de varias columnas y puede incluir otros tipos de bloques en cada columna
3. Medios y texto: inserte texto y archivo multimedia uno al lado del otro en un bloque; diferentes columnas
4. Más: divida su contenido en 2 partes, incluido un bloque "Leer más"
5. Salto de página: divide el contenido de su sitio en varias páginas
6. Separador: agregue una línea horizontal corta en su publicación
7. Espaciador: incluya un gran espacio en blanco rectangular entre dos bloques en su publicación
8. Columnas de texto: agregue texto y muéstrelo en dos a cuatro columnas, como un periódico.

Widgets: agregue algunos widgets a cualquier página o publicación

Estos bloques le permiten agregar widgets de WordPress dentro de su contenido. Es más probable que se usen en la barra lateral y el pie de página.

1. Código abreviado: inserte contenido personalizado como formularios a través de un código abreviado de WordPress
2. archivos: muestra un archivo mensual de tus publicaciones
3. calender: muestra un calendario mensual de tus publicaciones
4. categorías: lista de todas sus categorías de publicaciones
5. últimos comentarios: Vistazo de los últimos 5 comentarios (no el comentario completo)
6. últimas publicaciones: lista de sus publicaciones recientes
7. RSS: agregue un feed RSS a cualquier página o publicación
8. Buscar: agregue una búsqueda de WordPress a cualquier página o publicación
9. Nube de etiquetas: una lista en la nube de las etiquetas de sus publicaciones

Incrustaciones: inserte contenido de otras fuentes

Los bloques de incrustación le permiten incrustar imágenes, videos, tweets, audio, publicaciones de Facebook y otro contenido de fuentes externas.

• YouTube
• Gorjeo
• Facebook
• Instagram
• Vimeo
• nube de sonido
• Spotify
• Flickr
• Animoto
• en la nube
• ColegioHumor
• Dailymotion
• divertido o morir
• Hulu
• Imgur
• Issuu
• Pedal de arranque
• Meetup.com
• mezclanube
• fotobucket
• papá pollito
• Reddit
• ReverbNación
• Captura de pantalla
• Scribd
• compartir diapositivas
• PresumidoMug
• Altavoz
• TED
• Tumblr
• VideoPrensa
• WordPress
• WordPress.tv

Bloques reutilizables:

Una vez que presiona "Agregar a bloques reutilizables", un bloque se vuelve reutilizable para un uso posterior. Quizás pueda encontrarlo en la sección de menú compartido.

Complementos de terceros para ampliar tanto sus listas de bloqueo como su funcionalidad

Puede instalar otros complementos esenciales para ampliar sus listas de bloqueo con atributos avanzados y potentes. Al elegir un complemento rico en funciones, puede ser fácil agregar nuevos bloques a su editor. Y puede realizar muchas actividades altamente funcionales que no son posibles con los elementos de bloque predeterminados.

Por ejemplo, algunos complementos de galería le permiten agregar una galería con muchos efectos avanzados usando bloques.

Más allá de eso, también encontrará muchos complementos que se centran únicamente en agregar nuevos bloques. Aquí hemos enumerado algunos de los principales complementos de WordPress que puede usar para agregar nuevos bloques junto con los predeterminados.

1. Complementos definitivos para Gutenberg : complemento gratuito con más de 15 bloques de Gutenberg
2. CoBlocks – Constructor de páginas Bloques de Gutenberg
3. Apilable – Bloques de Gutenberg
4. Ultimate Blocks – Bloques personalizados de Gutenberg
5. Gutenberg avanzado : más de 20 bloques nuevos para Gutenberg
6. Kadence Block - Gutenberg Page Builder ToolKit
7. Envira Gallery - Bloque de WordPress para galerías de fotos
8. Bloques atómicos - Colección Gutenberg Block

Complementos definitivos para Gutenberg: complemento gratuito con más de 15 bloques de Gutenberg

Es uno de los complementos populares entre muchos usuarios de Gutenberg. The Ultimate Addons for Gutenberg es un paquete completo de bloques únicos y creativos. Por lo tanto, puede potenciar su editor para crear hermosas páginas y publicaciones con este complemento.

Incluye más de 15 bloques de Gutenberg, incluidos los siguientes:

• Botones múltiples: agregue múltiples botones personalizables dentro de un solo bloque receptivo.
• Encabezado avanzado: incluye encabezados y subtítulos modernos y atractivos con un separador
• Cuadro de información: inserte una imagen o un icono con un encabezado y una descripción
• Lista de precios: cree una lista de precios como el menú de un restaurante fácilmente
• Testimonio: agregue la revisión de los clientes usando este bloque

Lo más sorprendente es que este complemento viene con soporte incorporado para el tema Astra. Y Astra es totalmente compatible con Gutenberg.

CoBlocks – Constructor de páginas Bloques de Gutenberg

CoBlocks tiene un grupo creativo de bloques de creación de páginas de WordPress para el nuevo editor de Gutenberg. Mejorará su experiencia de creación de páginas con Gutenberg. Este complemento ligero de WordPress lo ayudará a crear hermosas páginas web.

Admite más de 20 bloques interactivos en este momento:

• Bloque acordeón
• Bloque de alerta
• Bloque de perfil de autor
• Bloque de botones
• Bloque de galería de carrusel
• Haz clic para twittear bloque
• Bloque de galería de collage
• Bloque separador dinámico
• Bloque de eventos (¡Nuevo!)
• Bloque de características
• Bloque de alimentos y bebidas
• Bloque de formulario
• bloque de gifs
• Bloque esencial de GitHub

y otros.

Puede crear todo el sitio web con funciones de CoBlocks. Además, te permite diseñar páginas web con atractivos elementos tipográficos.

Apilable – Bloques de Gutenberg

Stackable está especialmente diseñado para el nuevo editor de bloques de WordPress. Admite 23 bloques de creación de páginas de calidad para Gutenberg y más de 50 diseños de bloques y diseños de secciones/bloques preestablecidos. Proporciona opciones de diseño web avanzadas y flexibles para que su viaje de desarrollo web sea fluido.

Algunos bloques apilables populares son los siguientes:

• Bloque contenedor
• Bloque de cuadrícula de funciones
• Bloque de tarjeta
• Bloque de encabezado
• Bloque de conteo ascendente
• Bloque de miembros del equipo
• Bloque de notificación

Mejore su capacidad de diseño con estos diseños de diseño personalizables y diversos.

Ultimate Blocks- Bloques personalizados de Gutenberg

Este complemento de bloques de Gutenberg está especialmente diseñado para blogueros y especialistas en marketing. Por lo tanto, puede crear contenido mejor y atractivo con Gutenberg sin esfuerzo.

En este momento, Ultimate Blocks admite alrededor de 20 bloques para que su viaje de desarrollo sea más emocionante. Algunas características notables se dan a continuación:

• Filtro de contenido
• cuenta regresiva
• Control deslizante de imagen
• Contenido con pestañas
• Caja con estilo
• Cambio de contenido

Puede unirse a su grupo interactivo de Facebook para obtener más ayuda.

Gutenberg avanzado: más de 20 bloques nuevos para Gutenberg

Advanced Gutenberg hace que el editor predeterminado de Gutenberg sea más poderoso para crear sitios web profesionales increíblemente fácil. Proporciona más de 20 nuevos bloques y opciones para personalizar su sitio de WordPress sin problemas.

Aquí, obtendrás bloques únicos como:

• administrador de columnas
• Control deslizante de la última publicación
• Bloque de pestañas
• bloque de iconos
• Bloque de imagen avanzada
• Bloque de suscripción de correo electrónico
• Y muchos más

No obstante, cuentan con documentación elaborada y foro personalizado para dar soporte a sus usuarios.

Kadence Block - Gutenberg Page Builder ToolKit

Con este complemento, puede agregar bloques y opciones personalizados a su editor de Gutenberg. Tal vez pueda ampliar las capacidades de edición de Gutenberg para que pueda crear diseños personalizados y contenido más atractivo.

Kadence admite los siguientes bloques de hecho:

• Diseño de fila
• Galería avanzada
• Formulario
• Encabezado avanzado
• Botón Avanzado
• Pestañas
• Acordeón
• Testimonios
• Icono
• Espaciador / Divisor
• Caja de información
• Lista de iconos

Aparte de estos, lo hace útil para crear fácilmente cualquier tipo de diseño. Eso solo es posible con los complementos populares de WordPress Page Builder.

Envira Gallery: el mejor bloque de WordPress para galerías de fotos

Envira es un complemento potente y totalmente optimizado para insertar una galería en su sitio de WordPress sin comprometer la velocidad del sitio. Con este complemento de galería, puede incluir álbumes, etiquetas, integración de redes sociales, plantillas de galería/diseños de galería, enlaces profundos, paginación, comercio electrónico, pruebas de imágenes y mucho más.

Después de activar este complemento, encontrará una nueva opción en Bloques comunes. Desde allí, puede buscar diferentes tipos de estilos de galería según sus necesidades. Este complemento es completamente compatible con el complemento WooCommecre, por lo que puede usarlo fácilmente para cualquier sitio de fotografía para vender fotos.

Bloques atómicos - Colección de bloques de Gutenberg

Atomic Blocks trae un conjunto de nuevos y elegantes bloques de Gutenberg. El mismo equipo talentoso de Array Themes también está trabajando detrás de esta colección de bloques de moda.

Actualmente, Atomic Blocks tiene 15 bloques de Gutenberg, con más en camino:

• Sección y bloque de diseño
• Bloque de columnas avanzadas
• Bloque de boletín
• Bloque de precios
• Publicar bloque de cuadrícula
• Bloque contenedor
• Bloque de Testimonios
• Bloque de aviso en línea
• Bloque acordeón
• Compartir bloque de iconos
• Bloque de llamada a la acción
• Bloque de botones personalizable
• Bloque espaciador y divisor
• Bloque de perfil de autor
• Bloque capitular

Después de instalar el complemento, obtendrá una nueva sección de Bloques atómicos en la interfaz de Gutenberg. Puede consultar las demostraciones en vivo de todos los bloques antes de usarlos en su sitio web. ¡Crear páginas con el editor de bloques y Atomic Blocks le brinda control total para diseñar y lanzar rápidamente cualquier tipo de sitio que desee!

Sin embargo, puede encontrar algunos complementos más útiles con grandes bloques para crear contenido hermoso de manera optimizada. ¡No olvides compartir tus pensamientos con nosotros!

Gutenberg Blocks inicia una nueva era en el diseño de sitios

El editor de Gutenberg se basa principalmente en el concepto de bloques. Estos bloques han introducido una forma completamente nueva de editar publicaciones y contenido de la página en el Editor de WordPress. A través de estos bloques, puede agregar fácilmente múltiples tipos de contenido a sus publicaciones y páginas.

En este blog, tratamos de compartir toda la información sobre los bloques de Gutenberg. Por lo tanto, puede actualizarse fácilmente con el diseño de diseño revolucionario del nuevo Editor de WordPress.

También puede contarnos su historia y hacer cualquier consulta relacionada con WordPress en la sección de comentarios a continuación.