SendBeam

Integrations · Apps you already use

SendBeam and Webflow

Send Webflow form submissions to SendBeam as contacts, or embed a SendBeam form in Webflow directly.

Webflow sites have their own forms, and many site owners want those sign-ups in their email tool. There are two ways to do it: send Webflow's form submissions to SendBeam through an automation tool, or skip the tool and put a SendBeam form on the page with an Embed element.

Native integration: no

SendBeam has no Webflow app of its own. The routes below connect the two through n8n, Make or Zapier today, with the SendBeam node in n8n doing the SendBeam side for you.

How it works

  1. Pick your automation tool. n8n with the official SendBeam node, Make or Zapier. Each connects to Webflow with its own trigger, shown below.
  2. Create an API key. Settings → API keys in SendBeam, with contacts:write, and lists:write if the workflow adds people to a list. The full key is shown once. To send SendBeam events out instead, add an endpoint under Settings → Webhooks.
  3. Map the fields and test. Map the fields between Webflow and SendBeam, run the workflow once with your own address, and check the result before switching it on.

Code

In n8n: Webflow to SendBeam

n8n workflow 
1. Webflow Trigger, with the event Form Submission
2. SendBeam → Contact → Create or update
     Email       the email field from step 1
     First name  the first name, if there is one
     Source      webflow
3. SendBeam → Contact → Add to list
     Contact     By email, the same expression as step 2
     List        From list, then pick the list by name

Install the SendBeam node from Settings → Community nodes (n8n-nodes-sendbeam). Adding someone who is already a contact, or already on the list, succeeds, so the workflow is safe to re-run.

In Make: Webflow to the REST API

Make scenario 
Module 1: the Webflow module that watches for new form submissions
Module 2: HTTP → Make a request
URL:          https://sendbeam.io/api/v1/contacts
Method:       POST
Headers:      x-api-key = sb_live_XXXXXXXX_YYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYY
Body type:    Raw
Content type: JSON (application/json)
Request content:
{
  "email": "{{1.email}}",
  "first_name": "{{1.first_name}}",
  "source": "webflow"
}

Replace {{1.email}} and {{1.first_name}} with the email field and the name, mapped from module 1. A 409 answer means the contact already exists; route it to GET /api/v1/contacts?q= with the same address if you need the contact's id.

In Zapier: Webflow to the REST API

Zap 
Trigger  Webflow → New Form Submission
Action   Webhooks by Zapier → POST
URL           https://sendbeam.io/api/v1/contacts
Payload type  json
Data
  email       the email field
  first_name  the first name
  source      webflow
Headers
  x-api-key   sb_live_XXXXXXXX_YYYYYYYYYYYYYYYYYYYYYYYYYYYYYYYY

Webhooks by Zapier is available on Zapier's paid plans. The SendBeam app for Zapier will replace this step with a Create Contact action once it is listed in Zapier's directory.

Things to know

  • To avoid the automation step entirely, copy a form's embed code from Forms → your form → Embed code in SendBeam into a Webflow Embed element.
  • Each Webflow form sends its own field names; map the email field by the name you gave it in Webflow.
  • Only add people to a marketing list if they agreed to hear from you. Someone who only bought or booked can still get receipts and reminders through Send transactional.

Go further

  • Typeform — Turn Typeform responses into SendBeam contacts, on the list and with the tags you choose.
  • Google Sheets — Add each new row of a Google Sheet to SendBeam as a contact — handy for lists people still keep in a spreadsheet.
  • Shopify — Add Shopify customers to SendBeam as contacts, and tag the ones who agreed to marketing.

Also: Astro, Next.js, Hugo, Eleventy, WordPress, Cloudflare Pages, Netlify, Vercel, Zapier, Make, n8n, Tally, Jotform, Airtable, Notion, Stripe, Gumroad, Lemon Squeezy, Calendly, Eventbrite, HubSpot, Slack.