03 Ago

Bienvenido al Editor Gutenberg

De Montañas y Trabajos de impresión
(Traducción del artículo original de WordPress sobre el nuevo Editor Gutenberg.)

El objetivo de este nuevo editor es conseguir que agregar contenido enriquecido a WordPress sea simple y agradable. Todo este post está compuesto de piezas de contenido —algo similar a los ladrillos de LEGO—, con los que puedes moverte e interactuar. Mueve el cursor y verás que los diferentes bloques se iluminan con contornos y flechas. Presiona las flechas para reposicionar los bloques rápidamente, sin temor a perder cosas en el proceso de copiar y pegar.

Lo que estás leyendo ahora es un bloque de texto, el bloque más básico de todos. El bloque de texto tiene sus propios controles para ser desplazado libremente alrededor de la publicación …

… como éste otro, el cual está alineado a laderecha.

Los encabezados también son bloques separados, lo que te ayuda con el esquema y la organización de su contenido.

Una imagen vale más que mil palabras

El manejo de imágenes y medios con el mayor cuidado es uno de los enfoques principales del nuevo editor. Con suerte, encontrarás aspectos relacionados con la adición de subtítulos o el ancho completo de tus imágenes mucho más fáciles y robustos que antes.

Beautiful landscape
Si tu plantilla lo admite, verás el botón de “modificar anchura” en la barra de herramientas de la imagen. Pruébalo.

Intenta seleccionar y eliminar o editar el título: ahora no tienes que tener cuidado al seleccionar la imagen u otro texto por error y arruinar la presentación.

La Herramienta de Inserción o Insertador (Inserter Tool)

Imagina que todo lo que WordPress puede hacer está disponible para ti rápidamente y en el mismo lugar en la interfaz. No es necesario descubrir etiquetas HTML, clases, o recordar complicadas sintaxis de código abreviado. Éste es el espíritu del Insertador —el botón (+) que verás alrededor del editor—, que te permite explorar todos los bloques de contenido disponibles y agregarlos a tu publicación. Los plugins y los themes o plantillas pueden registrar sus propios bloques de contenido, abriendo todo tipo de posibilidades para la edición y publicación enriquecidas.

Inténtalo, puedes descubrir cosas que WordPress ya puede agregar a tus publicaciones que no sabías. Aquí hay una breve lista de lo que puedes encontrar actualmente en el Editor Gutenberg:

  • Texto y Encabezados
  • Imágenes y Vídeos
  • Galerías
  • Elementos “embebidos” (Embeds), como YouTube, Tweets, u otras publicaciones de WordPress.
  • Bloques de diseño, como Botones, Hero Images, Separadores, etc.
  • Y Listas como ésta por supuesto 🙂

Edición Visual

Una gran ventaja de los bloques es que puedes editarlos en su lugar y manipular su contenido directamente. En lugar de tener campos para editar elementos como el origen de una cita o el texto de un botón, puedes cambiar directamente el contenido. Intenta editar la siguiente cita:

El editor se esforzará por crear una nueva página y una experiencia de creación de publicaciones que haga que la escritura de publicaciones ricas sea sencilla, y que tenga “bloques” para facilitar lo que hoy puede necesitar códigos cortos, HTML personalizado, o el descubrimiento de incrustaciones de “misterio” (“mystery meat”).

Matt Mullenweg, 2017

La información correspondiente a la fuente de la cita es un campo de texto separado, similar a los títulos debajo de las imágenes, por lo que la estructura de la cita está protegida incluso si seleccionas, modificas o eliminas la fuente. Siempre es fácil volver a agregarlo.

Los bloques pueden ser cualquier cosa que necesites. Por ejemplo, es posible que desees agregar una cita tenue como parte de la composición de tu texto, o puedes preferir mostrar una estilizada gigante. Todas estas opciones están disponibles en el Insertador.

Puedes cambiar la cantidad de columnas en tus galerías arrastrando el control deslizante (slider) en el Inspector de bloques de la barra lateral o Sidebar.

Media Rich

[Rich media es un término que se usa en el mundo de la publicidad digital para describir los anuncios con funciones avanzadas como vídeo, sonido u otros elementos que atraen a los espectadores y consiguen que estos interactúen con el contenido. Fuente: https://support.google.com/richmedia/answer/2417545?hl=es]

Si combinas las nuevas alineaciones de anchura amplia (wide) y completa (full-wide) con Galerías, puedes crear un diseño rico en medios muy rápidamente:

Accessibility is important don't forget image alt attribute

Posiblemente, la imagen de ancho completo puede ser bastante grande. Pero a veces la imagen vale la pena.

La anterior es una Galería con solo dos imágenes. Es una forma fácil de crear diseños visualmente atractivos, sin tener que lidiar con elementos flotantes. También puedes volver a convertir fácilmente la galería de nuevo a imágenes individuales, utilizando el conmutador de bloque (block switcher).

En cualquier bloque puedes optar por alguna de estas alineaciones. El bloque de inserción o incrustación también dispone de ellas, y es responsivo con independencia de su bloque correspondiente:

Puedes construir cualquier bloque que quieras, estático o dinámico, decorativo o plano. He aquí un bloque de pullquote*:

[* Una pullquote es una cita o extracto de un artículo que normalmente se coloca en un tipo de letra más grande o distintivo en la misma página, que sirve para atraer a los lectores a un artículo o para resaltar un tema clave. Fuente: Traducido de Wikipedia]

El código es poesía

[Code is Poetry]

 

The WordPress community

Si deseas obtener más información sobre cómo crear bloques adicionales, o si estás interesado en ayudar con el proyecto, dirígete al repositorio de GitHub [GitHub repository].


¡Gracias por chequear Gutenberg!

👋

2 thoughts on “Bienvenido al Editor Gutenberg

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.


Centro de preferencias de privacidad

Uso de cookies en la web

Utilizamos cookies para ofrecerte una mejor experiencia de navegación, analizar el tráfico del sitio y personalizar el contenido.

Cookie PHPSESSID: Es el identificador predeterminado que PHP usa para las cookies generadas por session_start ().
Cookie wordpress_test_cookie: Esta cookie ayuda a WordPress a determinar si puede almacenar cookies.
Cookies wordpress_logged_in_519dcff367d7294724c21a743d81de64, wordpress_sec_519dcff367d7294724c21a743d81de64: Sirven para el correcto funcionamiento de WordPress.

PHPSESSID, wordpress_logged_in_519dcff367d7294724c21a743d81de64, wordpress_sec_519dcff367d7294724c21a743d81de64, wordpress_test_cookie
arcki2
IDE
__cfduid, __gat_emailit
dpr
1P_JAR, NID, _ga, _gat, _gid
_ga, _gid
bcookie, bscookie

RGPD

Sirven para habilitar el consentimiento -o no hacerlo- por parte del usuario para el Reglamento General de Protección de Datos (RGPD).

gdpr[allowed_cookies], gdpr[consent_types],