{
  "id": "O4Qq4FKDM0u53G7W",
  "name": "upload_image_to_webflow",
  "tags": [],
  "nodes": [
    {
      "id": "d66c510c-731b-4092-8167-8afba4bee42e",
      "name": "Step B \u2013 Upload binary to S3",
      "type": "n8n-nodes-base.httpRequest",
      "position": [
        672,
        0
      ],
      "parameters": {
        "url": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadUrl }}",
        "method": "POST",
        "options": {},
        "sendBody": true,
        "contentType": "multipart-form-data",
        "sendHeaders": true,
        "bodyParameters": {
          "parameters": [
            {
              "name": "acl",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadDetails.acl }}"
            },
            {
              "name": "bucket",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadDetails.bucket }}"
            },
            {
              "name": "X-Amz-Algorithm",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadDetails['X-Amz-Algorithm'] }}"
            },
            {
              "name": "X-Amz-Credential",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadDetails['X-Amz-Credential'] }}"
            },
            {
              "name": "X-Amz-Date",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadDetails['X-Amz-Date'] }}"
            },
            {
              "name": "key",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadDetails.key }}"
            },
            {
              "name": "Policy",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadDetails.Policy }}"
            },
            {
              "name": "X-Amz-Signature",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadDetails['X-Amz-Signature'] }}"
            },
            {
              "name": "success_action_status",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadDetails.success_action_status }}"
            },
            {
              "name": "content-type",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadDetails['content-type'] }}"
            },
            {
              "name": "Cache-Control",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.uploadDetails['Cache-Control'] }}"
            },
            {
              "name": "file",
              "parameterType": "formBinaryData",
              "inputDataFieldName": "={{ $('ARGS').item.binary.data }}"
            }
          ]
        },
        "headerParameters": {
          "parameters": [
            {
              "name": "content-type",
              "value": "multipart/form-data"
            }
          ]
        }
      },
      "typeVersion": 4.4
    },
    {
      "id": "ae9b69e2-7f28-4d7c-b955-08d4c7fdc86f",
      "name": "Crypto",
      "type": "n8n-nodes-base.crypto",
      "position": [
        224,
        0
      ],
      "parameters": {
        "type": "MD5",
        "binaryData": true,
        "dataPropertyName": "imageDataHash",
        "binaryPropertyName": "={{ $('ARGS').item.json.imageData }}"
      },
      "typeVersion": 2
    },
    {
      "id": "ca74a722-66b8-4ffa-9a49-6127fe5ae076",
      "name": "ARGS",
      "type": "n8n-nodes-base.executeWorkflowTrigger",
      "position": [
        0,
        0
      ],
      "parameters": {
        "workflowInputs": {
          "values": [
            {
              "name": "wfSiteId"
            },
            {
              "name": "imageData",
              "type": "object"
            },
            {
              "name": "fileName"
            }
          ]
        }
      },
      "typeVersion": 1.1
    },
    {
      "id": "b16e25ea-c6f5-46ad-9be8-479408d9e8a6",
      "name": "Step A \u2013 Announce asset in Webflow",
      "type": "n8n-nodes-base.httpRequest",
      "position": [
        448,
        0
      ],
      "parameters": {
        "url": "=https://api.webflow.com/v2/sites/{{ $('ARGS').item.json.wfSiteId }}/assets",
        "method": "POST",
        "options": {},
        "jsonBody": "={\n  \"fileName\": \"{{ $('ARGS').item.json.fileName }}\",\n  \"fileHash\": \"{{ $('Crypto').item.json.imageDataHash }}\"\n}",
        "sendBody": true,
        "specifyBody": "json",
        "authentication": "predefinedCredentialType",
        "nodeCredentialType": "httpBearerAuth"
      },
      "credentials": {
        "httpBearerAuth": {
          "name": "<your credential>"
        }
      },
      "typeVersion": 4.4
    },
    {
      "id": "e605df55-b775-4d06-9b5e-2d424cccc4f6",
      "name": "RETURN",
      "type": "n8n-nodes-base.set",
      "position": [
        896,
        0
      ],
      "parameters": {
        "options": {},
        "assignments": {
          "assignments": [
            {
              "id": "9fd86391-423c-44fd-9608-9d5341e53c1b",
              "name": "originalFileName",
              "type": "string",
              "value": "={{ $('ARGS').item.json.fileName }}"
            },
            {
              "id": "c2893e4d-6267-42d5-959c-7477463d84f6",
              "name": "fileId",
              "type": "string",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.id }}"
            },
            {
              "id": "196a50ad-3f28-4295-be94-5033948b8cb9",
              "name": "assetUrl",
              "type": "string",
              "value": "={{ $('Step A \u2013 Announce asset in Webflow').item.json.assetUrl }}"
            }
          ]
        }
      },
      "typeVersion": 3.4
    },
    {
      "id": "469c61fc-88c5-4d10-8a88-c15b081d7095",
      "name": "Sticky Note",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -656,
        -432
      ],
      "parameters": {
        "width": 560,
        "height": 608,
        "content": "## Upload Images to Webflow via API\nThis sub-workflow handles the two-step process of uploading a binary image to Webflow's Asset Manager.\n\n### How it works\n1. Receives imageData (binary), fileName, and wfSiteId\n2. Computes MD5 hash\n3. Announces the file to Webflow\n4. Uploads binary to Amazon S3 using returned credentials\n5. Returns originalFileName, fileId, and assetUrl\n\n\n### Setup\n- [ ] Set up Webflow site's API token as Bearer auth in the 'Step A \u2013 Announce asset in Webflow' node.\n- [ ] Call this workflow as a sub-workflow from your main workflow using the *Execute Sub-Workflow* node.\n\n\n### Customization\n- If you want to upload into a specific folder in the Webflow Asset Manager, add the folder ID to the body of the 'Step A \u2013 Announce asset in Webflow' node.\n- While this template is designed for images, Webflow's Asset API may accept other file types (e.g., videos, PDFs). The upload mechanism is the same.\n\n\n*Built by Oliver Engel  ENGELdevelopment | [Homepage](https://www.engeldevelopment.de/) | [LinkedIn](https://www.linkedin.com/in/oliver-engel-bb1984212)*"
      },
      "typeVersion": 1
    },
    {
      "id": "e6a98ba0-2c4a-4f9c-bf23-b51e28adad76",
      "name": "Sticky Note1",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        176,
        -128
      ],
      "parameters": {
        "color": 6,
        "width": 640,
        "height": 304,
        "content": "## 2. Upload to Webflow"
      },
      "typeVersion": 1
    },
    {
      "id": "a5a49c63-a9a8-4d6e-8312-4d0c1c1574cf",
      "name": "Sticky Note2",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        -64,
        -128
      ],
      "parameters": {
        "color": 6,
        "width": 208,
        "height": 304,
        "content": "## 1. Trigger & Input"
      },
      "typeVersion": 1
    },
    {
      "id": "127fa59e-aeb5-4a83-b65a-b41f3159c95b",
      "name": "Sticky Note3",
      "type": "n8n-nodes-base.stickyNote",
      "position": [
        848,
        -128
      ],
      "parameters": {
        "color": 6,
        "width": 208,
        "height": 304,
        "content": "## 3. Return values"
      },
      "typeVersion": 1
    }
  ],
  "active": false,
  "settings": {
    "binaryMode": "separate",
    "executionOrder": "v1"
  },
  "versionId": "f6438721-0d88-4bb4-87de-2fcb1ed5e5f9",
  "connections": {
    "ARGS": {
      "main": [
        [
          {
            "node": "Crypto",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "Crypto": {
      "main": [
        [
          {
            "node": "Step A \u2013 Announce asset in Webflow",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "Step B \u2013 Upload binary to S3": {
      "main": [
        [
          {
            "node": "RETURN",
            "type": "main",
            "index": 0
          }
        ]
      ]
    },
    "Step A \u2013 Announce asset in Webflow": {
      "main": [
        [
          {
            "node": "Step B \u2013 Upload binary to S3",
            "type": "main",
            "index": 0
          }
        ]
      ]
    }
  }
}