Customising Forms

Styling the form

The embed snippet is ordinary HTML with inline styles, and it is yours to edit. SendBeam does not host a stylesheet or inject any markup, so whatever you paste into your page is exactly what visitors see. Two approaches work well:

• Edit the inline styles — each input and the button carry a style attribute. Change the colours, border radius, padding and font to match your site.
• Strip the inline styles and use your own CSS — remove the style attributes and target the form by its id (sendbeam-form-<form-id>) from your stylesheet. This keeps the form in step with your design system.

Whichever you choose, keep these parts intact so the form keeps working:

• The form's id and the name attributes on the inputs (email, first_name, last_name, and for contact forms name, subject, message).
• The hidden input in the off-screen wrapper, and the wrapper itself. Its name is unique to your form and it must stay hidden and empty.
• The message element (sendbeam-msg-<form-id>) where the response is shown.
• The script block, which posts the submission and handles the response.
• The Turnstile div and script, if the form has Turnstile enabled.

The four pop-up styles take the same colours. A pop-up is a card rather than a bare form, so it lays itself out — accent, text, muted, field, border, radius, font and size are read exactly as they are here, and the style decides the rest. Set your colours once and the embedded form, the hosted page and all four pop-ups agree.

Button text

A form can also carry its own headline, line of copy and button label, set on its page under Form settings. They show on the hosted page and in the pop-up wherever the embed or plugin did not pass its own; a heading passed in the URL still wins.

The submit button reads "Subscribe" (or "Send message" for a contact form). Edit the button's text in the snippet to something more specific and action-oriented — it is the last thing a visitor reads before deciding to sign up.

Effective patterns:

• Benefit-focused: "Get weekly tips", "Send me the guide", "Start learning"
• First-person: "Sign me up", "Get my discount", "Join the list"
• Context-specific: "Download now" for a lead magnet, "Get early access" for a waitlist

Avoid generic labels like "Submit" or "Click here" — they do not tell the visitor what they are getting and perform noticeably worse than action-oriented alternatives.

Success message and redirect

After a successful submission, the snippet shows your thank-you message under the form or sends the visitor to a URL. Both are set on the form's page in SendBeam and returned with each submission, so you can change them without re-copying the snippet:

• Thank You Message — shown in the message element. Good for simple confirmations. Customise it to set expectations, for example: "You're on the list! Check your inbox for a welcome email."
• Redirect URL — the visitor is sent to this page after submitting. Useful for lead-magnet funnels where you want to deliver a download link, show a thank-you page, or present an upsell offer. When a redirect is set, it takes precedence over the message.

Fields and placeholders

Which inputs appear is decided by the Form Fields section on the form's page (email is always included; first name, last name and any custom fields are optional). The snippet lists them in a fixed order — email, first name, last name, then custom fields — but you can reorder the inputs in your HTML freely; only their name attributes matter.

Each input uses a placeholder rather than a label. Edit the placeholder text to anything you like — for example, "Your email address" or "What should we call you?" — or add <label> elements above the inputs for accessibility.