#190 – Crear un bloque de WordPress con JavaScript es un poco más fácil ahora

40:00
 
Compartir
 

Manage episode 348242960 series 2502574
Por Freelandev, Nahuai Badiola, and Esther solà descubierto por Player FM y nuestra comunidad - los derechos de autor son propiedad de la editorial, no de Player FM, y el audio se transmite directamente desde sus servidores. Presiona el botón de suscripción para rastrear cambios en Player FM o pega el URL del feed en otras aplicaciones de podcast.

Síguenos en:

Aunque ya hace años que somos conscientes de la necesidad de conocer JavaScript a fondo para mejorar en el desarrollo con WordPress, lo cierto es que muchos vamos posponiendo el momento de enfrentarnos a ello y ponernos manos a la obra. Hoy crear un bloque desde cero es mucho más fácil que hace un tiempo y para demostrarlo vamos a ver paso por paso cómo hacerlo.

Pero antes, como siempre....

¿Qué tal la semana?

Semana esther

Batallando con theme.json (que delicadito es….)

De nuevo con las cookies ??

Semana Nahuai

  • Investigando la mejor manera de ofrecer Osom Modal Login en un tema de bloques
  • Creando un bloque que muestre el nombre del usuario logueado.
  • Haciendo pruebas con el sistema SlotFill - https://developer.wordpress.org/news/2022/11/18/how-to-extend-wordpress-via-the-slotfill-system/
  • Buscando alternatitva a mostrar contenido de un CPT tiendo en cuenta el Content Drip y Past Content en Restrict Content Pro
  • Mostrando el tiempo de Content Drip en la columna de las entradas de un CPT.

Contenido Nahuai

3 nuevos tutoriales en Código Genesis de los cuales destaca: https://codigogenesis.com/excluir-entradas-categoria-bloque-listado-contenido-wordpress/

Tema de la semana:

Preparar entorno de desarrollo:

  • Instalar Homebrew (MacOS)
  • Instalar Node.js
  • Intalar npm
  • Local

Crear un bloque con el paquete create-block

  • npx @wordpress/create-block --variant dynamic user-block
  • npm start

Modificar los ficheros /src/:

  • render.php → código que se va a mostrar en el frontend
  • edit.js → código que se va a mostrar en el backend/editor
  • block.json → personalizar los ajustes del bloque que van a estar disponibles
  • index.js → Modificaciones SlotFill
  • editor.scss → CSS del editor
  • style.scss → CSS para ambos

Crear fichero zip

  • npm run plugin-zip
  • las modificaciones se muestran en la carpeta /build/

Novedades

Ya tenemos fecha para el State of the World de WordPress y se pueden enviar preguntas a Matt: https://wordpress.org/news/2022/11/state-of-the-word-2022/

Nuevo blog para developers de WordPress (en beta):

https://developer.wordpress.org/news/

Tip de la semana

Herramienta de Adobe para mejorar el audio: https://podcast.adobe.com/enhance

Menciones

Marta nos hace de CM en Mastodon.

Elías comenta que hace un tiempo que uso EDD para varios proyectos y le gusta mucho

219 episodios