DEV Community

Cover image for How to Get Custom Shopify Form Submissions Into Brevo as Real Contacts
Contact Form To Any API
Contact Form To Any API

Posted on

How to Get Custom Shopify Form Submissions Into Brevo as Real Contacts

Most Shopify stores running Brevo already have contact and order data flowing in through Brevo's native Shopify connection. That connection watches checkout, not the forms a store adds later. A wholesale inquiry form, a sample request, or a longer B2B lead form sits outside that sync entirely, and none of those submissions become Brevo contacts on their own.

This is a common blind spot once a store outgrows its default contact page. The fix isn't replacing what already works at checkout. It's giving form submissions a separate path into Brevo, one that creates a contact with the right attributes and drops it into the right list. That's a job for an app built to bridge Shopify forms and outside APIs, not for Brevo's built-in sync, which was never designed to look at forms in the first place.

What "connecting a form to Brevo" actually involves

Behind a phrase like "connect your form to Brevo" is a fairly mechanical exchange. Brevo exposes an API endpoint for creating or updating contacts. Whatever sits between your Shopify form and that endpoint needs three things: a valid API key sent in the request headers, a JSON body shaped the way Brevo expects, and a trigger that fires the request each time someone submits the form.

The JSON body is where most of the real configuration work happens. A form's email field maps to Brevo's "email" key, while anything Brevo treats as a custom attribute, company name, budget range, inquiry type, needs to sit inside an "attributes" object rather than at the top level. Get that structure wrong and the request usually still goes through. The fields just land empty or in the wrong place, which is a quieter failure than an outright error and easy to miss until someone checks Brevo directly.

Deciding what the form should collect

Before touching any integration settings, it helps to decide what data actually needs to reach Brevo. A field that isn't on the form can't be mapped later, so it's worth spending a few minutes upfront rather than adding fields as an afterthought. Beyond name, email, and a message box, dropdowns, checkboxes, and file uploads let a form capture more structured input, like a product category or a rough budget range for a wholesale inquiry.

Naming matters here too, especially for stores running more than one form. A wholesale inquiry and a general contact request will usually need to land in different Brevo lists, so keeping form names clear from the start saves confusion once several integrations exist side by side.

Handling the API key and request setup

Log into Brevo and pull the API key from your account settings. Brevo has shifted the exact location of this section before, so it's worth checking Brevo's own current documentation rather than relying on a screenshot from last year. Once you have the key, the integration side needs an endpoint URL for creating or updating a contact, a request method of POST, a raw JSON body, and authentication set to API key or headers, with the key itself placed in the headers rather than anywhere in the payload.

Refer to our detailed Shopify to Brevo integration walkthrough that steps through each field on that configuration screen individually, which is a useful second reference if you want exact wording rather than working from memory while you set this up.

Publishing the form and proving it works

A form and an integration don't do anything until the form is actually live. Generate the form's HTML from inside the app, drop it into a theme block through Shopify's theme customizer, save, and preview the page to confirm every field renders the way you expect.

This is the kind of workflow apps like IPS – Contact Form To API are built around, letting a store add a form to a storefront without touching backend code or hiring a developer for what's really a configuration task.

Before sending real customers to the form, submit a test yourself using an email you can actually check. Three things need to hold up: the submission shows up in the app's Submissions area, the API request to Brevo comes back successful, and the contact appears in Brevo with fields populated correctly rather than blank or scrambled. If any of those three don't check out, it's worth fixing before the form goes anywhere near actual traffic.

Watching for drift after launch

Testing once doesn't mean the integration stays correct forever. APIs change, keys expire, and Brevo occasionally renames an attribute on its end without much warning. An integration log that records each submission's status, along with Brevo's response and any error message, is what catches this kind of quiet failure before it turns into a stretch of missing leads nobody noticed.

There's also a practical safety net worth knowing about. Form submissions typically save independently of whether an integration is connected or working, so a broken Brevo link doesn't mean lost data. Anyone can still review or export submissions directly while the integration side gets sorted out, which takes some of the pressure off getting everything perfect before the form goes live.

Where things usually go wrong

A handful of issues account for most integration problems. Authorization errors almost always trace back to an expired or regenerated API key. Contacts arriving with blank or misplaced fields point to a mismatch between the JSON payload and the form's actual field names, often a single bracketed tag that doesn't match. And if a contact fails to create at all, it's worth checking whether a required attribute, usually email, arrived empty in the submission.

Once these pieces are in place, a custom Shopify form stops being a dead end that sits separately from your marketing tools. It becomes another entry point feeding Brevo the same way checkout does, just built around the leads a store collects before anyone reaches the cart.

Top comments (0)