# Framer-first rewrite

The Webflow version cannot just be ported over. In Framer, the core primitive is different: native forms send to email, Google Sheets, or a custom webhook, and Framer documents webhook submissions as JSON `POST` requests whose keys come from your field **Names**. On the Microsoft side, current Teams guidance routes incoming webhook-style automations through **Workflows / Power Automate**, not the older Office 365 connector pattern. So the correct Framer-native version of this article is **Framer form → webhook → Teams workflow**, with Make or Zapier only as optional middleware. ([Framer][1])

---

# Rewritten article draft

**Title:** How to send Framer form submissions to Microsoft Teams automatically

**Meta Description:** Get instant Microsoft Teams notifications whenever someone submits a Framer form. Learn the cleanest setup using Framer webhooks and Microsoft Teams Workflows.

**Slug:** `how-to-send-framer-form-submissions-to-microsoft-teams-automatically`

One of the easiest ways to miss high-intent leads is to bury form submissions inside a website dashboard nobody checks. If your team already works inside Microsoft Teams, the better move is to push every Framer submission directly into the right channel the moment it happens. Framer makes this cleaner than most people think because native forms can send submission data to a custom webhook without needing a third-party form plugin. ([Framer][1])

## Why Microsoft Teams notifications matter for Framer forms

Microsoft Teams notifications solve the real operational problem, not just the technical one. Sales can jump on inbound leads faster, support can see new requests in the same place they already collaborate, and shared channels make ownership more visible so submissions do not disappear into a private inbox.

Framer also gives you useful metadata knobs that make these alerts much better than a generic “new lead” message. Hidden fields can store things like form source or page type, form tracking IDs flow into Framer Analytics, and on Scale and Enterprise plans Framer can automatically include UTM parameters and GCLID with submissions. That gives your Teams notification real context instead of just raw contact data. ([Framer][2])

## Why this is different in Framer than in Webflow

The Webflow article naturally starts from a Webflow app trigger inside Make. That assumption breaks in Framer. Framer’s documented native form destinations are email, Google Sheets, and custom webhooks, so the integration primitive here is the **webhook itself**, not a Webflow-style event connector. Framer also makes field **Names**, hidden fields, tracking IDs, and campaign data much more important, because those values shape the JSON payload that every downstream tool receives. On the Teams side, Microsoft’s current model is **Workflows**, not the older connector approach many outdated tutorials still lean on. So the Framer version of this article has to be rebuilt around payload design and webhook handling, not around app authorization screens. ([Framer][1])

## Available ways to connect Framer forms to Microsoft Teams

There are three realistic approaches.

The first, and the one I recommend, is **Framer webhook → Microsoft Teams Workflow**. It is the leanest setup because Framer already emits webhook requests natively and Microsoft already supports webhook-triggered workflows inside Teams. The second option is **Framer webhook → Make → Teams**. The third is **Framer webhook → Zapier → Teams**. Make and Zapier both support webhook-driven automation into Teams, but they only become worth the extra layer when you need branching, enrichment, CRM updates, or multi-app orchestration beyond a straightforward Teams alert. ([Framer][3])

That recommendation also matches how Framer users solve this in practice. Once they go beyond Framer’s native destinations, the common path is webhook-based automation or middleware, not a mythical built-in Teams destination. Public Framer discussions around notifications and advanced form handling consistently point in that direction. ([Framer][4])

## How to send Framer form submissions to Microsoft Teams using Teams Workflows

### Step 1: Build your Framer form properly

Start with a native Framer form, not an embedded external form, unless you already depend on a third-party form stack. Framer’s native forms support more than 10 input types, designable states, email/Google Sheets/webhook destinations, spam protection, and rate limiting. For this integration, the most important detail is naming: Framer sends webhook data as JSON, and your input **Names** become the JSON keys. So do not leave messy field names like `Field 1` or `Input 2`. Use clean, stable names such as `full_name`, `email`, `company`, `phone`, `inquiry_type`, and `message`. ([Framer][5])

Add hidden fields if you want better routing downstream. Good examples are `form_name`, `page_source`, `routing_key`, or `sales_region`. In Framer, this matters: if you want a field included in the submission, use the actual **Hidden** property. Simply turning visibility off is not the same thing. Also consider adding a **tracking ID** to the form so submission events are easier to identify in Framer Analytics. If you are on Scale or Enterprise, Framer can also include UTM parameters and GCLID automatically in the submission data. ([Framer][2])

If the form matters commercially, set a backup path too. Framer’s forms product now supports fallback email alongside webhook-based submission flows, which is worth using if Teams notifications are mission-critical. ([Framer][6])

### Step 2: Create a Teams workflow from scratch

Inside Microsoft Teams, open the channel where you want the alerts to appear, go to **Workflows**, and create a workflow **from blank**. Then choose the trigger **When a Teams webhook request is received**. Microsoft documents both ready-made webhook templates and the from-scratch version, but the scratch version is better for Framer because Framer sends its own JSON payload rather than a preformatted Teams card payload. ([Microsoft Support][7])

For authentication, the direct Framer → Teams setup usually means selecting **Anyone**. Microsoft documents that the stricter tenant-based options require an auth token on the request, and Framer’s native webhook field is not a Microsoft-authenticated client. That is the core tradeoff of the direct method: it is simple, but it is not the most locked-down possible architecture. ([Microsoft Learn][8])

### Step 3: Parse the incoming Framer JSON

This is the key Framer-specific move. Add a **Parse JSON** step immediately after the webhook trigger. Framer sends a generic JSON object, and the keys come from your field Names, so you want Power Automate to convert those keys into usable dynamic tokens before you build the Teams message. Microsoft’s docs explicitly support generating a schema from a sample payload, and public Microsoft examples for custom webhook scenarios use this exact pattern: **webhook trigger → Parse JSON → post to Teams**. ([Framer][3])

Use a sample payload like this to generate the schema:

```json
{
  "full_name": "Jane Doe",
  "email": "jane@acme.com",
  "company": "Acme Inc",
  "inquiry_type": "Sales",
  "message": "We need a quote for a redesign project.",
  "form_name": "contact-form",
  "page_source": "contact-page",
  "utm_source": "google",
  "utm_medium": "cpc",
  "gclid": "test-click-id"
}
```

### Step 4: Post the notification into Teams

After **Parse JSON**, add either **Post message in a chat or channel** or **Post adaptive card in a chat or channel**. Use the plain message action when you just want a fast alert. Use an adaptive card when you want richer formatting or cleaner visual grouping. Microsoft documents both actions. Messages can be posted as the signed-in user or as the **Flow bot**, but posting to **private channels** is a known limitation for the message action. ([Microsoft Learn][8])

A clean plain-text message template could look like this:

```text
🔔 New Framer form submission

👤 Contact
Name: full_name
Email: email
Company: company

📝 Inquiry
Type: inquiry_type
Message: message

📍 Context
Form: form_name
Page: page_source
UTM Source: utm_source
UTM Medium: utm_medium
GCLID: gclid
```

If you want a more polished notification, switch to an adaptive card after the raw data is working. Microsoft’s own guidance supports webhook-triggered Teams workflows that post cards, but for most internal lead notifications, a simple message is faster to build and easier to debug. ([Microsoft Support][9])

### Step 5: Copy the Teams webhook URL into Framer

When you save the workflow, Teams / Power Automate gives you the callback URL for the webhook trigger. Copy that URL, go back to Framer, select your form, choose **Send To → Webhook**, and paste it in. Framer will then send each submission as a JSON `POST` request to that endpoint. Framer expects a **2xx** response from the receiver, retries up to **five times** on non-2xx responses, and does **not** follow redirects, so do not paste a URL that bounces elsewhere. ([Microsoft Support][7])

### Step 6: Publish and test the full flow

Publish the Framer site, submit a real test entry, and inspect the workflow run inside Teams / Power Automate. The first test should verify three things: the request reached the trigger, the parsed fields match what you expected, and the final message landed in the correct channel. Only after that should you spend time beautifying the notification.

## Advanced Framer-to-Teams improvements

Once the base workflow works, the smart upgrades are mostly about metadata and routing. Route different forms to different channels using a hidden `routing_key`. Include `form_name` and `page_source` in every alert. Add a Framer tracking ID so analytics and notification data are easier to connect. And if you are on Scale or Enterprise, bring UTM and GCLID values into Teams so sales can immediately see where a lead came from without leaving the channel. That is the kind of operational context that actually improves response quality. ([Framer][2])

## When Make or Zapier is the better choice

Use Make or Zapier when Teams is only one step in a larger workflow. Examples: enriching leads before posting them, branching by geography, deduplicating submissions, writing into a CRM, sending internal alerts to multiple systems, or validating requests in a more controlled middleware layer. Both platforms support webhook-based automation that can sit between Framer and Teams. But if the only business outcome you need is “Framer submission appears in Teams,” forcing middleware into the setup is just extra moving parts. ([Make][10])

## Troubleshooting common Framer form to Microsoft Teams issues

**Nothing is arriving in Teams.**
Check that the exact workflow callback URL is pasted into the Framer form webhook field, that the workflow trigger is saved, and that the receiver is returning a 2xx response. Framer retries on non-2xx responses, but only up to five times, and it will not follow redirects. ([Framer][3])

**Fields are missing or empty in Teams.**
The usual cause is that you changed the Framer field **Name** after generating the JSON schema, so Power Automate is parsing the wrong keys. In Framer webhooks, the field Names define the JSON keys. Regenerate the schema if you rename fields. ([Framer][3])

**Your hidden fields are not showing up.**
Use the actual **Hidden** property in Framer. Simply turning visibility off is not enough if you want the value included in the submission payload. ([Framer][2])

**UTM parameters are missing.**
Framer’s hidden fields do not automatically bind themselves to URL parameters, and automatic UTM / GCLID capture is tied to Scale and Enterprise. If you are not on those plans, you may need a custom workaround instead of assuming the values will appear by default. ([Framer][2])

**You cannot post to the channel you wanted.**
The standard Teams message action has a known limitation around private channels, and some Teams actions depend on the Workflows app / connector being allowed by an administrator. If the actions are missing or blocked, check tenant restrictions before you blame Framer. ([Microsoft Learn][11])

**The message is failing because it is too large.**
Microsoft documents an approximate **28 KB** size limit for posted messages. If your form includes very long free-text fields, trim what you send into Teams and keep the full payload elsewhere. ([Microsoft Learn][8])

**You want stronger security than an open webhook URL.**
That is the main weakness of the direct setup. Public Microsoft guidance and community discussion make it clear that leaving the webhook trigger on **Anyone** is the convenience path, not the most secure one. Framer can sign webhook requests using a secret and includes headers like `Framer-Signature` and `Framer-Webhook-Submission-Id`, but verifying those signatures generally makes more sense in your own middleware or endpoint before forwarding the data to Teams. ([Microsoft Learn][12])

## Conclusion

For Framer, the right mental model is not “connect Framer to Teams with a native app.” It is “let the Framer form emit structured JSON, then decide where that JSON should go.” If all you need is an internal Teams notification, **Framer webhook → Teams Workflow** is the sharpest default because it matches both products’ current architecture. Add Make, Zapier, or your own middleware only when you need more branching, more enrichment, or tighter security than a direct inbound workflow gives you. ([Framer][3])

## Bottom line

The original Webflow article was built around the wrong abstraction for Framer. This Framer version should be a **webhook-first** tutorial, with **Teams Workflows** as the default destination and Make/Zapier treated as optional escalation paths, not mandatory starting points.

[1]: https://www.framer.com/forms/ "https://www.framer.com/forms/"
[2]: https://www.framer.com/help/articles/hidden-fields-form-tracking/ "https://www.framer.com/help/articles/hidden-fields-form-tracking/"
[3]: https://www.framer.com/help/articles/framer-form-webhook-setup/ "https://www.framer.com/help/articles/framer-form-webhook-setup/"
[4]: https://www.framer.com/help/integrations/ "https://www.framer.com/help/integrations/"
[5]: https://www.framer.com/help/articles/how-can-i-add-a-contact-form-to-my-framer-website/ "https://www.framer.com/help/articles/how-can-i-add-a-contact-form-to-my-framer-website/"
[6]: https://www.framer.com/updates/forms "https://www.framer.com/updates/forms"
[7]: https://support.microsoft.com/en-us/office/create-incoming-webhooks-with-workflows-for-microsoft-teams-8ae491c7-0394-4861-ba59-055e33f75498 "https://support.microsoft.com/en-us/office/create-incoming-webhooks-with-workflows-for-microsoft-teams-8ae491c7-0394-4861-ba59-055e33f75498"
[8]: https://learn.microsoft.com/en-us/connectors/teams/ "https://learn.microsoft.com/en-us/connectors/teams/"
[9]: https://support.microsoft.com/en-gb/office/send-messages-in-teams-using-incoming-webhooks-323660ec-12ca-40b1-a1d3-a3df47e808c4 "https://support.microsoft.com/en-gb/office/send-messages-in-teams-using-incoming-webhooks-323660ec-12ca-40b1-a1d3-a3df47e808c4"
[10]: https://www.make.com/en/integrations/gateway/microsoft-teams "https://www.make.com/en/integrations/gateway/microsoft-teams"
[11]: https://learn.microsoft.com/en-us/power-automate/teams/send-a-message-in-teams "https://learn.microsoft.com/en-us/power-automate/teams/send-a-message-in-teams"
[12]: https://learn.microsoft.com/en-us/answers/questions/4414261/new-workflow "https://learn.microsoft.com/en-us/answers/questions/4414261/new-workflow"
