Agrega opciones a la barra de herramientas de tu bloque

Clase 8 de 15 • Curso de Creación de Bloques en Gutenberg para WordPress

Comentarios

Jorge Ladino Molano

student•

Esta interesante el curso, pero no entiendo porqué lo catalogaron como nivel "Básico" 😥😅

Luis Carlos Zapata García

student•

Yo tambien lo pregunto,lo vi por curiosidad.Pense que tendria menos código.

Natali Rivero

student•

Tampoco entendí, definitivamente no es un curso básico, como mínimo intermedio.

ttandem digital estudio

student•

¿Hay alguna forma de que al modificar el save no se tenga que eliminar el bloque insertado y volverlo a insertar?

Si yo desarrollo un bloque cómo el del ejemplo para un cliente y lo utiliza en unas 100 páginas, y a los meses me pide una opción más, por ejemplo un subtitulo, que se puede rellenar en algunos casos o no, ¿Tengo que ir a cada una de las 100 páginas y quitar y volver a insertar el bloque de muevo?

Lucio Negrello

teacher•

Hola, cómo estás? Sí, efectivamente esto se llama deprecation y migration, que nos sirve para darle retrocompatibilidad a los diferentes bloques. Acá te dejo la documentación donde explica cómo encarar este tipo de desarrollos: https://developer.wordpress.org/block-editor/reference-guides/block-api/block-deprecation/ Espero que te sirva para resolver tu consulta. Saludos!

Luis Gabriel

student•

Sip, les recomiendo pasar antes por un curso basico de PHP y de WordPress, uno de JavaScript tabien ayuda.

Luis Carlos Zapata García

student•

Yo recomiendo antes de esos cursos, hacer este de css y html. Con el gran profe DeGranda

Henry Alcaraz

student•

Un caso chistoso de este elemento, cuando ya tienes guardado un text es decir lo que esta abajo del titulo, la funcion de habilitar o desabilitar el boton de "add text" ya no funciona, solo funciona cuando el contenido del text es igual a nada, si tiene algo ya escrito no se desactiva el boton, por lo cual no oculta el elemento de forma dinamica.

solamente funciona cuando no tiene contenido, eso quiere decir que si quieres ocultarlo deberas de borrar lo que tiene escrito. Esto esta condicionado por el codigo:

isActive: text || hasText,
onClick: () => setHasText(!hasText),
```Que al momento de hacer la condicional de isActive aplica TRUE ya que el atributo text contiene informacion guardada o el estado indica que tiene texto existente, y al pasar al evento onClick, genera siempre un FALSO al invertir el true del isActive.

La solución para este caso es controlar el estado del boton mediante un atributo ya que asi se puede guardar dicho atributo y consultar para saber si tiene escrito algo y poder ocultarlo, ya que los estados del boton no se guardan y al volver a cargar la pagina no funcionara la parte de ocultar el parrafo si contiene un texto escrito.&#x20;

isActive: text || hasText,
onClick: () => setHasText(!hasText),
```Que al momento de hacer la condicional de isActive aplica TRUE ya que el atributo text contiene informacion guardada o el estado indica que tiene texto existente, y al pasar al evento onClick, genera siempre un FALSO al invertir el true del isActive.

La solución para este caso es controlar el estado del boton mediante un atributo ya que asi se puede guardar dicho atributo y consultar para saber si tiene escrito algo y poder ocultarlo, ya que los estados del boton no se guardan y al volver a cargar la pagina no funcionara la parte de ocultar el parrafo si contiene un texto escrito.&#x20;

Agrega opciones a la barra de herramientas de tu bloque

Introducción y preparación del entorno de desarrollo

¿Qué necesitas para aprender Gutenberg?

¿Qué es y cómo funciona Gutenberg?

¿Cuál es el mejor entorno para desarrollar bloques?

Bloques estáticos y opciones de bloques

Aprende a registrar tu primer bloque

Crea la vista de tu bloque para el editor

¿Cómo agregar opciones a tu bloque?

Crea la vista de tu bloque para el frontend

Agrega opciones a la barra de herramientas de tu bloque

Agrega diferentes estilos a tu bloque

Bloques Dinámicos

¿Qué son y cómo se utilizan los bloques dinámicos?

Aprende a registrar tu bloque de una forma más simple

¿Cómo usar una API dentro de tu bloque?

Agrega opciones a tu bloque dinámico

Crea la vista de tu bloque dinámico para el frontend

Conclusiones

¿Por dónde puedes seguir tu ruta de WordPress?