Sign-up Forms

Create customizable sign-up forms to collect new contacts for your email marketing

Sign-up forms are an essential way to grow your audience by collecting email subscribers directly from your website. Brew makes it easy to create customizable forms that match your brand and automatically add new contacts to your audience.

Brand-matched

Forms automatically use your brand colors and style for a consistent look

Easy to embed

Simple copy-paste installation on any website or landing page

CAN-SPAM compliant

All emails sent to form subscribers include elements to help you follow CAN-SPAM regulations

Creating Your First Sign-up Form

1. Go to the Forms page

   In your Brew dashboard, navigate to the Forms section in the main navigation.
2. Create a new form

   Click the Create Form button to start creating a new sign-up form.
3. Customize your form appearance

   Adjust the form’s appearance to match your brand:

   • Style: Choose between Inline, Popup, or Floating
   • Colors: Set your brand colors for the form background, text, and button
   • Typography: Select fonts that match your brand
   • Size: Adjust the form width and input field dimensions

   Select colors that match your brand’s design system. Your Brew design settings will be applied as defaults.

4. Configure form content

   Customize the text content of your form:

   • Form Title: The headline of your form (e.g., “Subscribe to our newsletter”)
   • Description: Supporting text explaining the benefits of subscribing
   • Input Placeholder: Text shown inside the email input field
   • Button Text: Call-to-action text for the submit button
   • Success Message: Text shown after a successful submission
5. Select form fields

   Choose which fields to include in your form:

   • Email (always required)
   • First Name (optional)
   • Last Name (optional)
   • Custom Fields (optional)

   Keep your form simple for higher conversion rates. Each additional field can reduce conversions by up to 10%.

6. Set up subscription groups

   Optionally, you can configure your form to add subscribers to specific subscription groups:

   1. Toggle on Add to subscription groups
   2. Select which subscription groups new subscribers should be added to

   To learn more, visit the Subscription Groups page.

7. Configure advanced settings

   Set additional options for your form:

   • Source Tracking: Set a custom source value to track where subscribers came from
   • Double Opt-in: Toggle whether subscribers need to confirm their email (recommended)
   • CAPTCHA: Enable to prevent spam submissions
   • Redirect URL: Set a URL to redirect subscribers after form submission

   We strongly recommend enabling double opt-in to maintain a clean audience and improve deliverability.

8. Get your form code

   Once you’re satisfied with your form, get the code to embed it on your website:

   1. Click the Get Code button
   2. Choose between HTML or JavaScript code options
   3. Copy the generated code
9. Add the form to your website

   Paste the copied code into your website where you want the form to appear.

   Website platform guides

   • For WordPress sites, paste the code into a Custom HTML block
   • For Squarespace, use the “Code” block to add your form
   • For other site builders, look for HTML or Custom Code options

Form Types and When to Use Them

Brew offers three different form styles, each suited for different situations:

Inline Form

Embeds directly within your content. Ideal for dedicated newsletter pages or blog post footers.

Popup Form

Appears as a popup overlay. Great for capturing attention when visitors first arrive or are about to leave.

Floating Form

Stays fixed in the bottom corner of the screen. Perfect for non-intrusive, persistent sign-up options.

Creating Custom Forms (Advanced)

If you need more control over your form’s appearance or behavior, you can create a custom form that submits to Brew’s API:

HTML Form

<form action="https://app.getbrew.ai/api/v1/forms/submit" method="post">
  <input type="email" name="email" required placeholder="Your email address">
  <input type="text" name="firstName" placeholder="First name">
  <input type="hidden" name="source" value="custom-landing-page">
  <input type="hidden" name="subscriptionGroups" value="sg12345,sg67890">
  <button type="submit">Subscribe</button>
</form>

<form action="https://app.getbrew.ai/api/v1/forms/submit" method="post">
  <input type="email" name="email" required placeholder="Your email address">
  <input type="text" name="firstName" placeholder="First name">
  <input type="hidden" name="source" value="custom-landing-page">
  <input type="hidden" name="subscriptionGroups" value="sg12345,sg67890">
  <button type="submit">Subscribe</button>
</form>

// Example using fetch API
document.getElementById('subscribe-form').addEventListener('submit', function(e) {
  e.preventDefault();
  
  const email = document.getElementById('email').value;
  const firstName = document.getElementById('firstName').value;
  
  fetch('https://app.getbrew.ai/api/v1/forms/submit', {
    method: 'POST',
    headers: {
      'Content-Type': 'application/json',
    },
    body: JSON.stringify({
      email: email,
      firstName: firstName,
      source: 'custom-js-form',
      subscriptionGroups: ['sg12345', 'sg67890']
    }),
  })
  .then(response => response.json())
  .then(data => {
    // Handle success
    document.getElementById('success-message').style.display = 'block';
  })
  .catch(error => {
    // Handle error
    console.error('Error:', error);
  });
});

Available form parameters

Parameter	Description	Example
email	Contact’s email address (required)	[e-mail]
firstName	Contact’s first name	Jane
lastName	Contact’s last name	Smith
source	Where the contact came from	homepage-form
subscriptionGroups	Comma-separated list of subscription group IDs	sg12345,sg67890
redirect	URL to redirect after submission	https://example.com/thanks
customField	Any custom property you’ve defined	industry=healthcare

Form Best Practices

Optimize for conversions

• Keep forms short - each additional field reduces conversions
• Use clear, benefit-focused headlines (“Get weekly AI insights”)
• Make button text specific and action-oriented (“Send me the guide”)
• Test different form placements to find what works best

Maintain list quality

• Use double opt-in to ensure quality subscribers
• Enable CAPTCHA to prevent bot submissions
• Set clear expectations about email frequency and content
• Consider using a subscription group selection for content preferences

Legal compliance

• Include a clear reference to your privacy policy
• Use checkboxes for explicit consent where required by law
• Make unsubscribe instructions clear
• Ensure compliance with regulations like CAN-SPAM

Managing Form Submissions

After setting up your form, you can track submissions and performance:

1. Go to the Forms section in Brew
2. Select the form you want to view
3. View submission statistics:
   • Total submissions
   • Conversion rate (if tracking views)
   • Submission trends over time

To troubleshoot a form that’s not working, check your website’s JavaScript console for errors and verify that the form code is correctly installed.

Need Help?

Our team is ready to support you at every step of your journey with Brew. Choose the option that works best for you:

Self-Service Tools

Search Documentation

Type in the “Ask any question” search bar at the top left to instantly find relevant documentation pages.

AI Assistant Chat

Click the sparkle ✨ icon next to the “Ask any question” search bar in the top left to chat with our AI assistant that’s been trained on our entire documentation.

ChatGPT/Claude Integration

Click “Open in ChatGPT” at the top right of any page to analyze documentation with ChatGPT or Claude for deeper insights.

Search Documentation

Type in the “Ask any question” search bar at the top left to instantly find relevant documentation pages.

AI Assistant Chat

Click the sparkle ✨ icon next to the “Ask any question” search bar in the top left to chat with our AI assistant that’s been trained on our entire documentation.

ChatGPT/Claude Integration

Click “Open in ChatGPT” at the top right of any page to analyze documentation with ChatGPT or Claude for deeper insights.

Schedule a Call

Book time with our founders for personalized guidance on strategy, best practices, or complex implementation questions.

Call Us Directly

Need immediate assistance? Reach us at [phone] for urgent issues or time-sensitive questions.

Slack Channel

Our preferred support channel. You’ll receive an invite after signup for direct founder support and fast responses.

Email Support

Contact us at [e-mail] for detailed inquiries or if you prefer not to use Slack.