Recursos · Integración n8n

Integración Webflow n8nAutomatiza Webflow con n8n.

Webflow guarda el contenido, n8n se encarga de lo que se repite. La integración Webflow n8n abre 5 operaciones sobre los items de colección y un trigger que escucha 8 eventos, desde un pedido nuevo hasta la publicación del sitio. Pensada para quien todavía edita colecciones a mano.

Probar la integración Webflow en n8nVer las 5 operaciones

Reseñas verificadas en Trustpilot · Agencia de IA, automatización y growth

Por qué automatizar

¿Qué resuelve la integración Webflow n8n?

El nodo Webflow habla con la API de Webflow desde dentro de un flujo de trabajo. Un solo recurso, Item, y 5 operaciones sobre ella: crear, leer, listar, actualizar y borrar una entrada de colección. Al lado está el Webflow Trigger, que registra un webhook, es decir una URL que Webflow llama en cuanto pasa algo en el sitio, y arranca un flujo con cualquiera de los 8 eventos disponibles.

Primer caso, la tienda que avisa sola. ecomm_new_order arranca el flujo, el pedido aparece en Slack con su detalle y la confirmación sale por Gmail. Nadie tiene que mirar el panel de Webflow para saber que hay venta.

Segundo caso, el formulario que alimenta la lista. form_submission entrega los campos en cuanto el visitante pulsa enviar, el contacto entra en Mailchimp y queda copia en Google Sheets para quien hace el seguimiento. Se acabó el export manual.

Tercer caso, la colección que se llena desde otro sitio. Una ficha aprobada en otra herramienta se convierte en entrada con item.create, y la corrección que llega dos horas después pasa por item.update. El editor de Webflow vuelve a servir solo para el diseño.

Ahora los límites, que conviene conocer antes de dibujar nada. El nodo cubre los items de colección y ahí se detiene. Lo que quieras tocar en otra parte de Webflow no existe como operación aquí. Para esos casos está el nodo HTTP Request, que llama a cualquier endpoint de la API reutilizando el mismo credential mediante la autenticación predefinida, sin una segunda configuración que mantener, sea con el token de sitio o con el credential OAuth2.

Dos detalles más. El trigger vigila un solo sitio, elegido en Site Name or ID, y escucha un solo evento: varios sitios o varios eventos significan varios flujos. Y la Webflow Data API V1 está obsoleta: en OAuth2 el interruptor Legacy sirve únicamente para ese caso. Si es tu primer proyecto serio con n8n, el Curso n8n y la Reseña n8n cubren todo lo que rodea al nodo.

Conexión

¿Cómo se conecta Webflow con n8n?

  1. 01

    Genera el token en Webflow

    Hay dos métodos de autenticación: token de acceso a la API y OAuth2. El token es el camino corto. Entra en los ajustes del sitio, Site Settings > Apps & integrations > API access, y pulsa Generate API token. Hace falta un sitio ya creado: el token está ligado a un sitio concreto y sin sitio no hay nada a lo que asociarlo.

  2. 02

    Guarda el credential en n8n

    En n8n, abre el menú Credentials y crea un credential de Webflow, luego pega el Access Token. Un credential es donde n8n guarda un acceso: lo escribes una vez y lo reutilizan todos los flujos. Con OAuth2, registra una aplicación en tu espacio de Webflow, copia la OAuth callback URL que muestra n8n como Redirect URI, y trae de vuelta el Client ID y el Client Secret.

  3. 03

    Elige el sitio y prueba una lectura

    Coloca un nodo Webflow en el lienzo, selecciona el credential y elige Site Name or ID y Collection Name or ID en las listas que n8n rellena por ti. Ejecuta item.getAll una vez sobre una colección pequeña: si vuelven entradas, el acceso es correcto. Del lado del trigger, la misma prueba consiste en elegir el sitio y un evento, y activar el flujo.

Disparadores

¿Qué pone en marcha un flujo de Webflow ?

Webflow Trigger es el nodo que arranca un workflow cuando algo ocurre en Webflow. Escucha 8 eventos, listados abajo por familia. Eliges uno o varios, activas el workflow y n8n registra el webhook (la URL que Webflow llama) en tu cuenta.

Lo que ves en n8n

Todos los eventos, por familia

Una fila por objeto, un chip por acción. El evento que marcas en el nodo se escribe objeto.acción; pasa el cursor por un chip para leer cuándo se dispara.

collection_item_changed.*1
  • collection_item_changed.
    • collection_item_changed
collection_item_created.*1
  • collection_item_created.
    • collection_item_created
collection_item_deleted.*1
  • collection_item_deleted.
    • collection_item_deleted
ecomm_inventory_changed.*1
  • ecomm_inventory_changed.
    • ecomm_inventory_changed
ecomm_new_order.*1
  • ecomm_new_order.
    • ecomm_new_order
ecomm_order_changed.*1
  • ecomm_order_changed.
    • ecomm_order_changed
form_submission.*1
  • form_submission.
    • form_submission
site_publish.*1
  • site_publish.
    • site_publish

Notas de configuración

01Set up the Webflow TriggerEl Webflow Trigger es el nodo que arranca el flujo cuando ocurre algo en Webflow, en lugar de que tú pulses Execute. La versión 2 funciona por webhook: al activar el flujo, n8n registra su URL en Webflow y cada evento que coincide llega en unos segundos. Nada que programar, ningún intervalo que ajustar.

El Webflow Trigger es el nodo que arranca el flujo cuando ocurre algo en Webflow, en lugar de que tú pulses Execute. La versión 2 funciona por webhook: al activar el flujo, n8n registra su URL en Webflow y cada evento que coincide llega en unos segundos. Nada que programar, ningún intervalo que ajustar.

Parámetros clave

  • Site Name or ID: el sitio vigilado, tomado de la lista que n8n carga con tu credential, o escrito como expresión del tipo {{ $json.siteId }} cuando el valor viene de un nodo anterior. Una expresión es la forma que tiene n8n de leer un campo del item que entra.
  • Event: el único evento que escucha este trigger, elegido entre 8. No hay comodín, así que un flujo nunca escucha todo a la vez.
Cuándo usarlo
siempre que Webflow sea el punto de partida del proceso y no su destino, y esperar a una ejecución programada llegue tarde.
02Collection item eventsTres de los 8 eventos siguen la vida de una entrada de colección: collection_item_created, collection_item_changed y collection_item_deleted. Cada uno entrega al flujo la entrada que se ha movido, así que puedes mantener una copia al día en otro sitio sin releer la colección entera cada vez.

Tres de los 8 eventos siguen la vida de una entrada de colección: collection_item_created, collection_item_changed y collection_item_deleted. Cada uno entrega al flujo la entrada que se ha movido, así que puedes mantener una copia al día en otro sitio sin releer la colección entera cada vez.

Parámetros clave

  • Event: elige el sentido que te interesa, creación para una entrada nueva, modificación para una corrección, borrado para una limpieza. Cubrir los tres son tres flujos.
  • Site Name or ID: los eventos se aplican al sitio, no a una colección concreta, de modo que pasan por ahí las entradas de todas sus colecciones.
Casos de uso
una nueva ficha de proyecto aparece en la colección y el flujo la publica en el canal del equipo con su enlace; una entrada borrada limpia la fila correspondiente en la hoja de seguimiento y las dos siguen cuadrando.
03Ecommerce eventsLa parte de tienda aporta otros tres: ecomm_new_order cuando se hace un pedido, ecomm_order_changed cuando ese pedido se modifica después, y ecomm_inventory_changed cuando cambia el stock. Juntos permiten seguir una venta de principio a fin sin que nadie vigile el panel de Webflow.

La parte de tienda aporta otros tres: ecomm_new_order cuando se hace un pedido, ecomm_order_changed cuando ese pedido se modifica después, y ecomm_inventory_changed cuando cambia el stock. Juntos permiten seguir una venta de principio a fin sin que nadie vigile el panel de Webflow.

Parámetros clave

  • Event: uno por flujo. Un circuito de pedidos que quiere la venta y también sus cambios posteriores se monta como dos flujos que alimentan los mismos pasos siguientes.
  • Site Name or ID: el sitio donde vive la tienda. Estos eventos solo existen donde el ecommerce está configurado, y el trigger se queda callado en un sitio puramente editorial.
Casos de uso
un pedido abre la tarea de preparación y publica el detalle en el canal de almacén; un stock que baja del nivel que aceptas lanza un recordatorio de reposición a quien compra.
04Form submission and site publishform_submission entrega los campos de un formulario de Webflow en el segundo en que un visitante lo envía. site_publish salta cuando se publica el sitio. Comparten poco, salvo ser los dos únicos eventos que no hablan de entradas de colección, y los dos funcionan muy bien como punto de entrada.

form_submission entrega los campos de un formulario de Webflow en el segundo en que un visitante lo envía. site_publish salta cuando se publica el sitio. Comparten poco, salvo ser los dos únicos eventos que no hablan de entradas de colección, y los dos funcionan muy bien como punto de entrada.

Parámetros clave

  • Event: form_submission para todo lo relacionado con contactos, site_publish para el trabajo de publicación y las comprobaciones posteriores.
  • Site Name or ID: los formularios de todas las páginas de ese sitio llegan por el mismo trigger, así que el reparto por formulario se hace más adelante en el flujo, no en el nodo.
Casos de uso
un formulario de contacto alimenta la lista de correo y el canal comercial en una sola ejecución, sin herramienta de formularios intermedia; una publicación lanza una revisión de enlaces y avisa al cliente de que la nueva versión ya está en línea.
Acciones

Lo que el nodo Webflow sabe hacer

El nodo Webflow expone 5 operaciones en 1 recursos. Para cada una: el nodo tal como lo configuras en n8n, los campos obligatorios y nuestras notas de campo.

Matriz recursos × operaciones
RecursoCreateGetGet ManyUpdateDelete
Item✓✓✓✓✓

Item

5 operaciones
01

Create an item

item.create

Lo que ves en n8n

Notas y casos de uso

Añade una entrada a una colección y la devuelve tal como Webflow la ha guardado, identificador incluido, que reutilizan los nodos siguientes.

Parámetros clave

  • Site Name or ID: el sitio donde vive la colección de destino, elegido en la lista o dado por una expresión.
  • Collection Name or ID: la colección que recibe la entrada.
  • Live: activado, la entrada se publica de inmediato en el sitio en línea; desactivado, espera en la colección a la próxima publicación.
  • Fields: el contenido en sí, añadido campo a campo con Add Field, normalmente alimentado por expresiones como {{ $json.title }} del nodo anterior.
Casos de uso
un borrador aprobado se convierte en artículo publicado sin que nadie lo reescriba en el editor.
02

Delete an item

item.deleteItem

Lo que ves en n8n

Notas y casos de uso

Retira definitivamente una entrada de una colección. Webflow trabaja aquí con el identificador, nunca con el nombre que ves en el editor, así que el flujo tiene que llevar ese valor consigo.

Parámetros clave

  • Site Name or ID: el sitio cuya colección contiene la entrada.
  • Collection Name or ID: la colección afectada.
  • Item ID: la entrada a borrar, que suele llegar como {{ $json.itemId }} desde el paso que la identificó.
Casos de uso
una oferta de empleo cerrada en la herramienta de selección desaparece ese mismo día de la colección de empleo.
03

Get an item

item.get

Lo que ves en n8n

Notas y casos de uso

Lee una entrada y devuelve sus campos, sin tocar nada. Es el paso que sirve para decidir qué hace el resto del flujo.

Parámetros clave

  • Site Name or ID: el sitio que contiene la colección.
  • Collection Name or ID: donde vive la entrada.
  • Item ID: la entrada a leer, a menudo recogida de un evento del trigger con una expresión.
Casos de uso
antes de escribir una actualización, el flujo relee los valores actuales y se salta la escritura cuando nada ha cambiado, lo que deja un historial legible en el sitio.
04

Get many items

item.getAll

Lo que ves en n8n

Notas y casos de uso

Lista las entradas de una colección, un item por entrada, listas para filtrar o comparar más adelante.

Parámetros clave

  • Site Name or ID: el sitio del que se lee.
  • Collection Name or ID: la colección a listar.
  • Return All: activado, n8n encadena las páginas de la API y trae todas las entradas; desactivado, se detiene en Limit.
  • Limit: el número máximo de entradas devueltas cuando Return All está desactivado, cómodo para probar sobre una colección grande.
Casos de uso
un export nocturno de toda la colección de productos a una hoja de cálculo, para detectar las fichas sin imagen.
05

Update an item

item.update

Lo que ves en n8n

Notas y casos de uso

Reescribe los campos de una entrada existente manteniendo el mismo identificador, así que los enlaces y las referencias que apuntan a ella sobreviven.

Parámetros clave

  • Site Name or ID: el sitio donde está la colección.
  • Collection Name or ID: la colección a la que pertenece la entrada.
  • Item ID: la entrada a modificar.
  • Live: activado, los valores nuevos aparecen en el sitio publicado; desactivado, se quedan en la colección.
  • Fields: solo se envían los campos que añadas aquí, así que una actualización de precio toca únicamente el precio.
Casos de uso
stock y tarifas sincronizados cada mañana desde el back office.
Necesitas ayuda

¿Necesitas ayuda para automatizar Webflow con n8n?

El equipo te responde directamente.

Cada mensaje lo lee una persona.

FAQ

Webflow y n8n, las preguntas de siempre

01¿La integración Webflow n8n es gratis?
Sí por el lado de n8n. El nodo Webflow y el Webflow Trigger vienen incluidos con n8n: no hay nada que instalar ni nada extra que pagar para usarlos. Vale tanto en n8n Cloud, la oferta alojada por n8n, como en una instancia autoalojada con Docker o npm, en Community Edition bajo licencia Sustainable Use. Un flujo se comporta igual en los dos casos, de modo que puedes prototipar en uno y ejecutar en el otro. Lo que cuesta tu plan de Webflow es otra cuestión y depende de tu propia cuenta.
02¿Qué credentials hacen falta para Webflow en n8n?
Funcionan dos métodos, y el nodo en sí no tiene selector de autenticación: la elección se hace al crear el credential. El primero es el token de acceso a la API, que se genera desde Site Settings, Apps and integrations, API access, con el botón Generate API token. Necesita un sitio ya creado y solo cubre ese sitio. El segundo es OAuth2: registra una aplicación en tu espacio de Webflow, añade la OAuth callback URL de n8n como Redirect URI y trae de vuelta el Client ID y el Client Secret. Si sigues con la Webflow Data API V1, que está obsoleta, el interruptor Legacy existe para eso. El mismo credential sirve para el nodo y para el trigger.
03¿Qué límites tiene el nodo de Webflow?
Depende de lo que esperes. El nodo expone un solo recurso, Item, con 5 operaciones: todo lo que se salga de las entradas de colección no está cubierto y ningún ajuste lo añadirá. La respuesta en ese caso es el nodo HTTP Request, que llama a cualquier endpoint de la API de Webflow reutilizando el mismo credential gracias a la autenticación predefinida. En lectura, Get Many se detiene en Limit mientras Return All esté desactivado, y esa es la razón clásica de un export que parece incompleto. En escritura, es Live quien decide si el cambio llega al sitio publicado o se queda en la colección.
04¿El trigger de Webflow reacciona en tiempo real?
Sí. El Webflow Trigger funciona por webhook: Webflow llama a una URL de n8n en el momento en que ocurre el evento, en lugar de que n8n pregunte una y otra vez si algo ha cambiado. n8n registra esa URL en Webflow al activar el flujo y los eventos llegan en unos segundos. No hay intervalo que ajustar ni retraso que prever en el diseño. Dos restricciones que sí conviene tener en cuenta: el trigger vigila un solo sitio, definido en Site Name or ID, y escucha un solo evento de los 8 disponibles, sin comodín. Varios eventos, varios flujos.
05¿n8n o Make para automatizar Webflow?
Depende de qué quieras controlar. Make es una plataforma de automatización alojada, facturada por operación y sin opción de autoalojamiento. n8n corre en su propia nube o en tu servidor, algo que pesa cuando los formularios y los datos de pedido que atraviesan el flujo deben quedarse en una infraestructura tuya. El modelo de coste también cambia: por operación en un lado, por instancia o por plan en el otro. Del lado de Webflow, la cobertura es la que describe esta página, 5 operaciones y 8 eventos de trigger: compárala con tu lista real de necesidades y no con un recuento de funciones.
Misma plataforma

Otros docs útiles sobre este stack.

Ver todas las integraciones