Cómo crear un Gutenberg Block personalizado sin frameworks

No necesitas React ni herramientas avanzadas para crear tus propios bloques. Aquí te enseño la versión simple.

1. Archivo block.json

{
  "apiVersion": 2,
  "name": "cesar/alerta",
  "title": "Caja de Alerta",
  "category": "widgets",
  "editorScript": "file:./editor.js"
}

2. editor.js

wp.blocks.registerBlockType("cesar/alerta", {
    edit: () => wp.element.createElement("div", {}, "Vista en editor"),
    save: () => "Contenido final del bloque"
});

3. Activar como plugin

Estructura:

mi-bloque/
  block.json
  editor.js
  mi-bloque.php

Conclusión

Crear bloques simples puede ser extremadamente rápido y útil para contenido repetitivo.