sendgrid integration website

SendGrid Integration for Your Website: API, SMTP or Plugin

Connect SendGrid to your website the right way: API key, domain authentication, a server-side send route and a tested contact form. Steps, options and pitfalls.

To connect SendGrid to a website, you create an account, generate a restricted API key, authenticate your sending domain, and send mail from a server-side route, never from the browser. That is the whole shape of the job. The details decide whether your contact form emails land in an inbox or vanish.

This guide walks through each step of a SendGrid integration, compares the three ways to connect (direct API, SMTP relay, plugin), and shows where an AI-built site fits in.

TL;DR

SendGrid is now part of Twilio. Its docs, product pages and support moved to Twilio.com, so older links may redirect.
Use the API when your site controls forms, templates and responses. Use SMTP relay when your CMS or plugin only speaks SMTP.
Keep the API key on the server. Give it the smallest permission it needs, such as Mail Send.
Authenticate your domain for production. Send from your own verified address and put the visitor’s address in Reply-To.
Test with one request before you wire up the form.

What SendGrid is today
Three ways to connect SendGrid to a website
What you need before your first SendGrid email
Authenticate your domain in SendGrid
Send a SendGrid test email first
Connect your contact form to SendGrid safely
Common SendGrid errors and quick fixes
Our perspective: the key is the easy part
Building the site around your email
Beyond transactional email
Is SendGrid the right choice for your website?
SendGrid integration FAQ
Sources

What SendGrid is today

Twilio acquired SendGrid in 2019. Twilio now says the same email solutions remain available and supported, and it hosts them on Twilio.com. When people search for “the SendGrid website”, the current destination is the Twilio SendGrid documentation and product pages.

SendGrid handles two kinds of email:

Transactional: form notifications, receipts, password resets, booking confirmations.
Marketing: campaigns and contact lists.

The v3 API reference covers sending, dynamic templates, contacts, campaigns and statistics. That breadth is why a simple contact form can later grow into a full email program without changing providers.

For most sites, the first job is small: when someone fills out a form, you get an email, and they get a confirmation.

Three ways to connect SendGrid to a website

Twilio documents both REST APIs and SMTP relay, and third-party connections exist on top of them. The right choice follows your site’s architecture.

Route	Best when	You control	Watch out for
Direct API (v3 Mail Send)	You run your own server code or an app backend	Validation, templates, logging, rate limits, error handling	You write and maintain the code
SMTP relay	Your CMS, plugin or mail library only offers SMTP settings	Very little beyond the message itself	Less structured feedback when something fails
Plugin or add-on	Your form tool already has a SendGrid option	Whatever the plugin exposes	Compatibility and maintenance status

On plugins, SendGrid’s third-party integrations section lists connections, and form tools such as Gravity Forms document form notification setups. Before you rely on one, confirm it works with your current CMS version and that it is still being updated.

A simple rule: if you need custom behavior, such as different emails per form, logging, or spam checks, use the API. If you only need “send this notification”, a plugin or SMTP is fine.

What you need before your first SendGrid email

The SendGrid API quickstart lists the prerequisites. In plain terms:

A SendGrid account. Sign up through Twilio’s SendGrid pages.
An API key. You create it in the SendGrid dashboard and copy it once.
A verified sender identity. Either a single verified address or an authenticated domain.
A place to run server code. A backend route, a serverless function or a connector that does this for you.

The API accepts HTTPS requests to https://api.sendgrid.com/v3/mail/send with a Bearer token in the Authorization header and a JSON body. SendGrid says its IP addresses can change without notice, so never hard-code them. Use the documented base URL.

Create a limited API key

The v3 API uses API-key authentication, not Basic Authentication. Keys can be permission-limited. For a website, grant only what the site does. If it only sends form emails, Mail Send access is enough. Then a leaked key cannot read your contacts or change your settings.

Name the key after the site, for example “portfolio-contact-form”. When you retire the site, you know which key to delete.

Official libraries

Twilio provides SDKs for C#, Go, Java, Node.js, PHP, Python and Ruby, alongside plain REST access. You do not need an SDK. One HTTPS call works. An SDK saves time if you are already in one of those languages.

Authenticate your domain in SendGrid

An API key lets you send. Sender identity decides whether the mail arrives.

Twilio’s quickstart recommends Domain Authentication for production. Single Sender Verification is fine for testing, but Twilio calls Domain Authentication the better experience and says it is required to upgrade from a free account.

Domain authentication works through DNS. SendGrid’s domain authentication guide explains that SendGrid generates the DNS records you add at your domain host. By default these are CNAME records that cover SPF and DKIM, plus a TXT record for DMARC. After you add them, receiving servers can check that your messages are really from you.

The steps:

Start domain authentication in the SendGrid dashboard.
Enter the domain you send from, such as yourbusiness.com.
Copy the DNS records SendGrid generates.
Add them at your DNS provider.
Return to SendGrid and verify.

DNS changes can take up to 48 hours to apply, so do this early, not the hour before launch.

Send a SendGrid test email first

Do not debug your form and your SendGrid setup at the same time. SendGrid’s support team has a guide to sending a test email with Postman, written for exactly the moment when sending fails and you need to see whether the API call is correct.

A basic request needs:

a recipient
a verified From address
a subject
content

The request is a POST with Content-Type: application/json and an Authorization: Bearer header. The documented maximum total message size is 20MB, including headers, content and attachments, so a form with an attachment field needs a size limit on your side.

If the test email arrives, SendGrid is working and any later failure is in your site. If it does not, check the key, the sender identity and the response body before touching anything else.

Connect your contact form to SendGrid safely

For small business sites, the most common use is a contact form. The flow has four parts:

The visitor submits the form in the browser.
A server route receives the data and validates it.
The route calls SendGrid with your key.
The route sends an internal notification and, if you want, a confirmation to the visitor.

The boundary matters. The browser collects input, while authentication and sending belong in a protected backend. Keep the key in a server-side environment variable or secret store. Never put it in client-side JavaScript or public environment variables. Anyone can read what a browser receives.

From versus Reply-To

A common mistake is setting the visitor’s address as the From address. SendGrid expects From to be a verified sender or authenticated domain. Use your own address as From and the visitor’s address as Reply-To. Twilio’s contact form template follows this pattern. You press Reply, and the answer goes to the visitor, while the message still passes authentication.

Validate before you send

A server route gives you control that a plugin often does not:

Reject empty or malformed fields.
Add a honeypot field or rate limit to cut spam.
Log each submission so you can find a lost lead.
Return a clear error to the browser when SendGrid fails.

If you also store leads, our guides on email capture forms and sending form data to Google Sheets cover the form side in more detail. For passing one submission to several systems, see our webhook setup guide.

Common SendGrid errors and quick fixes

Symptom	Likely cause	Check
401 or 403 response	Wrong key, or key lacks Mail Send permission	Recreate the key with the right scope
400 response	Missing recipient, subject or content, or an unverified From	Read the error body, confirm the sender identity
Mail sent but lands in spam	Domain not authenticated	Verify the DNS records
Works locally, fails live	Key missing from the production environment	Set the server variable on the live site
Replies go to yourself	Visitor address used wrongly	Put it in Reply-To

Most failures come down to the key, the sender identity or the environment. Check them in that order.

Our perspective: the key is the easy part

Most integration guides start with the API key. We would start with the architecture.

A website that only displays pages cannot safely hold a secret. Sending email needs one. So every SendGrid setup answers one question: where does the sending code run? With a traditional site, you write that route yourself or add a plugin. With a site built by an AI assistant, the same question still applies. The assistant can write the form and the logic, but the secret still has to live somewhere the browser cannot read.

That is why we describe WebsitePublisher as an AI web platform for websites and apps, not only pages. Your AI assistant, whether ChatGPT, Claude, Gemini or another, builds and publishes through the WebsitePublisher connector. The platform includes more than 100 integrations covering areas such as email, payments and lead capture. You store API keys yourself in the dashboard vault, never in the chat, and integrations use them on the server. Check the integrations available in your account to see how your email setup should work. The principle stays the same either way: collect in the browser, send from the server.

We also think email should be treated as a product feature, not an afterthought. A confirmation message is often the first thing a new customer receives from you. A contact form that silently fails costs real leads. Two habits help: test with one request first, and authenticate your domain before launch.

Finally, avoid lock-in on your content. On WebsitePublisher, you keep control of your content and visual changes in the browser editor, and you are not tied to one AI session. Your email setup should be as portable: keep the key and DNS records documented so you can move them if your stack changes.

Our perspective: the key is the easy part — overview diagram

Building the site around your email

If you do not have a site yet, you can describe it in plain language and let your AI assistant build it. Your assistant builds and publishes websites and apps on WebsitePublisher through the WebsitePublisher connector, and every change is live immediately. There is no separate deploy or publish step.

A practical order for a new small business site:

Describe the pages and the contact form to your assistant.
Review the result in the browser editor and adjust text and design directly.
Set up SendGrid with a limited key and an authenticated domain.
Send a test submission and confirm both emails arrive.

See how the AI web platform works, or check the plans and pricing to pick one. There is a free plan to start with.

Other integration walkthroughs may help too: connecting HubSpot, embedding Mailchimp and Typeform. You can browse all of them on our blog.

Beyond transactional email

SendGrid is not only a form mailer. Twilio positions it as shared infrastructure for transactional email, campaigns, templates, contact management and delivery analytics. That helps when a portfolio or landing page grows into something bigger.

Some ways it grows:

Templates: move from plain text to dynamic templates so order and booking emails look consistent.
Contacts: store subscribers and send campaigns from the same account.
Statistics: watch delivery and engagement data to spot problems early.

Keep transactional and marketing mail clearly separate in your head. A confirmation someone expects is not a newsletter. Marketing messages need consent and an unsubscribe path.

Is SendGrid the right choice for your website?

There is no universal winner. Email services come in several types: developer-first sending APIs, cloud infrastructure mail services, and marketing platforms with built-in sending. Judge them on the requirement in front of you:

transactional delivery or marketing automation
templates and API or SMTP support
analytics
regional needs and compliance
support and pricing at your volume

SendGrid is a strong fit when one service must cover both developer API email and marketing campaigns. If you only send a handful of notifications, a lighter setup may be enough. Check current plan limits on Twilio’s site before you commit, because they change.

SendGrid integration FAQ

What happened to SendGrid?

Twilio acquired SendGrid in 2019. The email products, documentation and support now live on Twilio.com, and the product is commonly called Twilio SendGrid. Twilio says the same email solutions remain available and supported.

Should I use the SendGrid API or SMTP on my website?

Use the API when your site needs control over forms, templates, confirmations or error handling. Use SMTP relay when your CMS or plugin is built around SMTP settings and you do not need custom logic. Either way, authenticate your domain.

Where do I put my SendGrid API key?

On the server only, in an environment variable or secret store. Never place it in client-side JavaScript, page source or public environment variables. Create the key with the smallest permission needed, such as Mail Send.

Why do my contact form emails go to spam?

The most common cause is an unauthenticated sending domain, or a visitor’s address used as the From address. Authenticate your domain with the DNS records SendGrid generates, send from your own address, and use Reply-To for the visitor.

Can I use SendGrid on a static website?

Not directly from the browser, because the API key would be visible to anyone. A static site needs a small server-side piece, such as a serverless function or a platform connector, that receives the form data and calls SendGrid with the key kept on the server.

How long does SendGrid domain authentication take?

Adding the records takes a few minutes, but Twilio notes that DNS changes can take up to 48 hours to apply. If verification fails at first, wait and click Verify again. Start this early, before launch day.

Does SendGrid work with WordPress and other CMS platforms?

Yes. Most CMS platforms and form plugins can send through SendGrid using SMTP relay or a dedicated plugin. Check that the plugin supports your current CMS version and is still maintained, and authenticate your domain either way.