Automatisation Webflow avec n8n : gestion des soumissions de formulaires

Ce workflow n8n a pour objectif d'automatiser la gestion des soumissions de formulaires sur Webflow, permettant ainsi aux entreprises de gagner du temps et d'améliorer leur efficacité. Dans un contexte où la collecte de données est cruciale, ce processus simplifie l'enregistrement des informations des utilisateurs directement dans Google Sheets. Cela est particulièrement utile pour les équipes marketing et les responsables de projet qui souhaitent centraliser les données de manière fluide et efficace. Étape 1 : le déclencheur 'On Form Submission' s'active dès qu'un utilisateur soumet un formulaire sur Webflow. Étape 2 : les données sont ensuite préparées grâce au noeud 'Prepare Fields', qui permet de manipuler les informations avant leur enregistrement. Étape 3 : les données sont transférées vers Google Sheets via le noeud 'Append New Row', où chaque soumission est ajoutée dans une nouvelle ligne du document spécifié. Ce workflow utilise également plusieurs noeuds 'Sticky Note' pour visualiser et organiser les informations de manière intuitive. En intégrant cette automatisation n8n, les entreprises peuvent réduire les erreurs humaines, améliorer la traçabilité des données et gagner un temps précieux dans la gestion des soumissions. La valeur ajoutée réside dans la simplification du processus de collecte et d'analyse des données, permettant ainsi aux équipes de se concentrer sur des tâches à plus forte valeur ajoutée.

À qui s'adresse ce workflow ?

Ce que ce workflow résout

Comment ça fonctionne

Visualisation du workflow n8n

Schéma des nœuds et connexions de ce workflow n8n, généré à partir du JSON n8n.

Importer dans n8n en un clic

Inscris-toi gratuitement pour télécharger le fichier .json, puis fais Import from File dans n8n pour déployer le workflow en quelques secondes.

{
  "nodes": [
    {
      "id": "096a8e0c-8f72-40fb-aa1e-118fb33a3916",
      "name": "Prepare Fields",
      "type": "n8n-nodes-base.code",
      "position": [
        1740,
        860
      ],
      "parameters": {
        "jsCode": "const formData = $input.all()[0].json.payload.data\nconst Date = $input.all()[0].json.payload.submittedAt || new Date()\n\nreturn {\n  ...formData, // creates a new field for every element inside formData\n  Date\n}\n\n  \n"
      },
      "notesInFlow": false,
      "typeVersion": 2
    },
    {
      "id": "c98bb655-aa79-447f-897d-56ba9640073b",
      "name": "Sticky Note1",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        1660,

Personnaliser ce workflow

Détail des nœuds n8n

• 01

  Prepare Fields

  Ce noeud prépare les champs en exécutant un code JavaScript.

• 02

  Sticky Note1

  Ce noeud crée une note autocollante avec des paramètres de couleur, largeur, hauteur et contenu.

• 03

  Sticky Note2

  Ce noeud crée une deuxième note autocollante avec des spécifications de couleur, largeur, hauteur et contenu.

• 04

  Sticky Note3

  Ce noeud génère une troisième note autocollante en utilisant des paramètres de couleur, largeur, hauteur et contenu.

• 05

  On Form Submission

  Ce noeud déclenche le workflow lors de la soumission d'un formulaire sur un site Webflow.

• 06

  Append New Row

  Ce noeud ajoute une nouvelle ligne dans une feuille Google Sheets avec les colonnes et options spécifiées.

• 07

  Sticky Note4

  Ce noeud crée une quatrième note autocollante avec des paramètres de couleur, largeur, hauteur et contenu.