Creating an embedded subscribe form

Embedded subscribe forms let you collect subscriber details — like email, name, and birthday — and automatically add them to your beehiiv audience. These forms are fully customizable and can be embedded across external websites to help grow your newsletter beyond your publication site.

As of April 30, 2026, the subscribe form builder was updated with new embed layout options, trigger settings, and a draft/publish workflow. All new forms use the updated builder, and most existing forms have been migrated to it as well. If you have a form that still opens in the previous builder, see the FAQ for how to handle it.

This article covers how embedded subscribe forms work alongside other beehiiv features, how to create and customize a form, and choosing an embed layout and trigger. The FAQ at the end covers common questions including how to manage forms created before the April 2026 update.


Quick tips to get you started

  • Embedded subscribe forms are for external sites only. Embedded subscribe forms are designed to be placed on outside websites — like a personal site, blog, or storefront. They're separate from your beehiiv Subscribe page and from subscribe forms built in the Website Builder, which connect to a signup flow.
  • Build audience segments. You can craft audience segments based on which embedded form a subscriber used, helping you target specific groups more effectively.
  • Trigger automations when someone subscribes. Use the Email submitted trigger to start an automation workflow whenever someone completes a subscribe form.
  • Duplicate existing forms before editing. If you have forms embedded on external sites that you'd like to update, duplicate the existing form first and edit the copy. This keeps your live embed working while you make changes. When you're ready, grab the new embed code and update your site. See the FAQ for more detail.

How to create a subscribe form

  1. From the left panel, go to Subscribers > Subscribe forms. Click Create new form.

  2. The form builder will open with the Content tab active and the Header section expanded.

Name your form

  1. Click the pencil icon next to the name at the top of the canvas to name your form. In the modal that appears, enter a clear, descriptive name, this is for your reference only and won't be visible to subscribers. Click Save.

Using the form builder

Key controls across the top of the builder:

  • Live preview on the canvas: The canvas displays a live preview of your form. Changes made in the right panel are reflected immediately.
  • Undo/Redo: Use these icons above the canvas to reverse or reapply recent changes.
  • Save changes / Get embed code: While editing, the button in the top-right corner reads Save changes. Once your changes are saved, it updates to Get embed code.
  • Exit builder: Click the arrow in the upper-left corner to return to your Subscribe forms list.

Setting up your content

  1. On the Content tab, configure the Header section:
  • Title: Displays your publication name by default. You can update the text or toggle it off.
  • Subtitle: If you've added a one-line description in your publication settings, it will appear here by default. You can toggle it off or edit the text to customize it.
     
  1. Click the arrow next to Form to expand the fields and button controls.


    Form options include:
  • Fields: The fields on subscribe forms are pulled from the custom fields you've created in your account. The Email field is required and appears by default. To collect additional data, click Add Field and select from your existing custom fields. You can designate fields as required and add as many fields as you'd like.
  • Label: To display a name for a field on the form, toggle on Label. You can edit the label text without changing the underlying custom field in your account. Otherwise, Label is disabled when there is only one field. 
  • Button: Button text is required and defaults to Subscribe. You can customize it. Set the message that displays while the form is submitting under While submitting, this field is also required.
  • Use beehiiv Consent Text: Toggle on to include beehiiv’s standard consent text which links to both our Terms of Service/Use and Privacy Policy.
  • ToS and Privacy Policy: Toggle either on to include your own links beneath the form.
Pro Tip: The Slim layout does not support Terms of Service toggles or additional fields. If you need those elements, use the Regular layout instead.

Choosing an embed layout and trigger

  1. Click on the Style tab at the top of the right panel. The Embed section will be expanded by default. Here you can configure how and when your form appears on the page.

    Layout: Click the Layout field to open the Embed layout selector. Choose a layout type, Regular or Slim, and an embed type.
  • Regular gives you a full form with an optional header, title, subtitle, and additional fields.
  • Slim gives you a compact single-row layout with just an email field and submit button.


    Select an embed type:
  • Inline: Renders directly where you paste the embed code, in a footer, sidebar, article body, or dedicated signup section. Works well with both Regular and Slim layouts.
  • Slide left: Slides in from the bottom-left corner of the page.
  • Slide right: Slides in from the bottom-right corner of the page.
  • Popup: A modal that appears centered over the page.
  • Sticky top: A persistent banner fixed to the top of the viewport. Stays visible as the visitor scrolls. Slim works especially well here.
  • Sticky bottom: A persistent banner fixed to the bottom of the viewport. Stays visible as the visitor scrolls. Slim works especially well here.

Trigger: For any embed type other than Inline, you can configure the trigger when the form appears. 


Click the Trigger field to choose from the following options:

  • Immediately: The form appears as soon as the page loads.
  • After time delay: The form appears after a set number of seconds on the page.
  • After scrolling: The form appears after a visitor scrolls to a set percentage of the page.
  • When an element is visible: The form appears when a specific page element comes into view.
  • On click or DOM event: The form appears when a visitor clicks a specific element or a custom DOM event fires.
  • Exit intent: The form appears when the visitor's cursor shows intent to leave the page or desktop.

Under Frequency, set how often the form can reappear to the same visitor:

  • Every visit: The form appears every time the visitor returns to the page.
  • After X days: The form reappears after a set number of days when the visitor returns.

Styling your form

  1. Still on the Style tab, click to close the Embed section, then click to open the Background section to customize the visual appearance of your form. Styling is organized into three sections: Background, Header, and Form.

Background settings:

  • Color: Click the color swatch to open background options. Use the Color, Gradient, or Image tabs to set the background. Only one option can be applied at a time. Access recently used and preset colors from your theme. 
  • Transparent background: Toggle on to give the form a transparent background. 
  • Border color, style, and thickness: Set the color, style (Solid, Dashed, or Dotted), and thickness of the form's border.
  • Shadow: Choose a shadow size for the form border, or select None.
  • Width: Set the form width, choose from Fit Content, Fixed, Relative, or Fill. Select Fill to create a full-width form.
  • Height: Set the form height, choose from Fit Content or Fixed. 
  • Direction: Set the form layout to vertical or horizontal.
  • X-Align / Y-Align: Align form content horizontally and vertically.
  • Padding, Gap, Corner radius: Adjust spacing and corner rounding in pixels.
     
  1. Click to close the Background section, then click to open the Header section. The Header styling section is divided into Base, Title, and Subtitle.

Header settings:

  • Base: Set background color, border color, border style, shadow, thickness, sizing, alignment, padding, gap, and corner radius for the header container.
  • Title and Subtitle: For each, set font family, font weight, font size, line height, font color, alignment, and width.
Pro Tip: If you've toggled off the Title and Subtitle on the Content tab, you can skip the Header styling section entirely.
  1. Click to close the Header section, then click to open the Form section. The Form styling section is divided into Base, Fields, Button, and Terms.

Form settings:

  • Base: Set background color, border, direction, form width, field and button height, padding, gap, and corner radius.
  • Fields: Set font family, weight, size, input text, placeholder text color, background color, border, and corner radius for form fields. Under Label styling — only applies when Label is toggled on for a field: set font family, weight, size, and label color. Under Radio/checkbox styling — applies to True/False and List (Multi-Select) custom fields: set accent color and background color. Tech Note: If Label is not toggled on for a custom field, the label styling options will not apply.
  • Button: Set font family, weight, size, input text, placeholder text color, background color, border, and corner radius for the submit button.
  • Terms: Set font family, font size, and font color for the ToS and Privacy Policy label text. Set accent color and background color for the consent checkbox. The Terms styling section only applies when ToS, Privacy Policy, or beehiiv Consent Text is enabled in your publication's security settings.

Configuring post-submission settings

  1. Click on the Settings tab in the right panel to control what happens after someone submits the form.

  • Show a success message: Enabled by default with an example message. Enter or adjust the confirmation text that appears after submission (up to 80 characters).
  • Redirect to an external website: Switch to this option to redirect subscribers to a URL after they sign up. Use the full URL including https:// at the beginning.
  • Remove emails from the redirect URL: Enable this to substitute the subscriber's email in the redirect URL with their subscription ID.
  • Require double opt-in: Enable this to require all new subscribers through this form to confirm their email address via a double opt-in email. This setting applies only to this form — it will override your publication-wide opt-in setting only if double opt-in is disabled at the publication level.

Saving and publishing your form

  1. Once you're happy with your form, click the arrow next to Save changes in the top-right corner. The button will update to Get embed code once your changes are saved.


    Select from:
  • Save & get embed code: Saves your form and opens the embed code modal. Your live embed keeps showing the previously published version until you explicitly publish, so you can save and iterate without affecting what visitors see on your site.
  • Save changes: Saves your current changes without opening the embed code modal. When you're ready to push your changes live, click the dropdown arrow next to Get embed code and select Publish.

Getting and using the embed code

  1. After clicking Save & get embed code, a modal will appear with your form's embed code ready to copy and paste as a single script tag.

  • For Inline forms, copy and paste the embed code in the body of the page where you want the form to appear.
  • For Popup, Slide left, Slide right, Sticky top, and Sticky bottom forms, you can copy and paste the script anywhere on the page HTML, in a header, footer, or any HTML block. The script handles placement based on your embed layout settings.

    For advanced setups, copy the Attribution tracking script to forward UTM parameters to beehiiv. Paste this script just before the closing <body> tag of the page where your form will appear.

    Click Close when you're done.
  1. To return to your list of forms, click the arrow in the top-left corner of the canvas. Once you publish a new version, the script automatically serves the latest version, so your changes appear on your site without needing to replace the embed code.

Embedding tips

  • Always preview your site after embedding to ensure the form displays and functions as expected.
  • Check the form on both mobile and desktop to confirm it performs across devices.
  • If you're unsure where to paste the embed code, check your platform's documentation or use their support resources.

Frequently asked questions about embedded subscribe forms 

Existing forms and migration

    What happened to my existing forms after the April 2026 update?
    Most existing forms were automatically migrated to the updated builder and will open with the new experience when you edit them. A small number of forms that have not been edited in a long time may still open in the previous builder. In either case, your live embed is unaffected, what changed is the editing experience, not what's rendering on your site.
    I want to update an existing form that's already embedded on my site. What's the safest way to do that?

    Duplicate the existing form first, then edit the copy. This keeps your live embed running without interruption while you make changes. When you're ready, click Get embed code on the new form, replace the embed code on your external site, and the updated form will go live. You can leave the original in place and unpublish or delete it once you've confirmed the new one is working. 

    Tech Note: Editing and saving an existing form generates a new embed code. If you edit the original directly without updating the embed code on your site, your external site will continue to show the previously published version until you replace the code.
    Can I have multiple embed layouts for the same form?
    Each form has a single embed layout. To run the same signup experience as both an inline form and a popup, duplicate the form and change the embed layout on the copy. Both forms will add subscribers to the same beehiiv audience.
    Does changing the embed layout of an existing form affect my live site?
    Yes. Because a form has a single embed layout, changing it will affect how the form appears on every page it's currently embedded on. If you want to try a different layout without disrupting your live embed, duplicate the form and change the layout on the copy instead.

Setting up and managing forms

    What is the embed code made of?
    The embed code is a single script tag that loads your subscribe form. It handles placement automatically based on your embed layout settings; inline forms render where you paste the code, while popup, slide, and sticky forms are positioned by the script regardless of where it sits on the page.
    Where does my form name appear in beehiiv?
    The name you give your form appears as the Embed name in a subscriber's profile under acquisition details. It's also used to identify the form in automations, so it's worth choosing a name that reflects where or how the form is being used.
    Are there any custom field types that can't be used on an embedded subscribe form?
    No, all custom field types can be used on a subscribe form, including True/False (which displays as radio buttons) and List: Single/Multi-Select.
    Why isn't my Terms of Service or Privacy Policy showing on the form?
    If either field is left blank or the URL isn't properly formatted, it won't appear on your form. Make sure you include the full URL, starting with https:// — for example, https://yourwebsite.com.
    How do I delete an embedded subscribe form?

    On your Subscribe forms page, click the 3 dots menu for the form you want to remove and select Delete. You'll be prompted to confirm, as this will immediately disable the form if it's currently embedded. 

    Reminder: If you delete a form that was used to collect subscribers, any data tied to that form, including how a subscriber joined, will be removed from their profile in beehiiv. Proceed with caution when deleting active or previously used forms.
    How does beehiiv protect against bots and spam submissions?
    Embedded subscribe forms use the same bot protection system as the rest of the beehiiv platform. If a submission is flagged as suspicious, the subscriber will be prompted to complete a verification challenge inline within the form before it submits. All communication with beehiiv's servers is encrypted via HTTPS to ensure subscriber data is transmitted securely.

Using and placing your form

    Does the form support signup flows?
    Embedded subscribe forms do not route subscribers through multi-step signup flows. You can configure a single redirect URL on successful submission. To use a multi-step signup flow, build your subscribe form in the Website Builder instead.
    Can I add a subscribe form to my beehiiv website?
    The Website Builder includes native subscribe form functionality that lets you create and customize forms directly in the builder and connect them to a signup flow. If you're using the legacy Website Builder, you can add a subscribe form to a custom page using an HTML block but you may need to adjust the form's height and width to ensure it renders as intended.
    Does the form work with Boosts and Recommendations?
    Yes. If using a legacy site, you can display a Recommendations widget after someone subscribes via an embedded form.
    How do I add a beehiiv subscribe form to an external website?

    The embed code is a single script tag that works on any platform that supports custom HTML. It has been tested across WordPress, Squarespace, Webflow, Wix, Shopify, Framer, and plain HTML sites.

    The following instructions may vary depending on the website builder or CMS you're using.

    Disclaimer: The platform-specific steps below were generated using AI as a courtesy to help you get started. beehiiv cannot guarantee their accuracy or completeness and is not liable for how this information is used. Always consult your website platform's official documentation or support team for the most accurate and up-to-date instructions.

    General steps for most websites

    1. From the left panel, go to Subscribers > Subscribe forms and open your form.
    2. Click Get embed code to copy the script.
    3. Paste the embed code into your website's HTML wherever you want the form to appear — for example, in a footer, sidebar, or on a specific page.

    WordPress

    1. In the WordPress editor, add a Custom HTML block.
    2. Paste your beehiiv subscribe form embed code into the block and save.

    Shopify

    1. In Shopify admin, go to Online Store > Pages.
    2. Select the page where you want the form.
    3. Click the Show HTML icon in the editor.
    4. Paste your embed code, save the page, and preview it live.

    Squarespace

    1. In the Squarespace editor, go to the section where you want the form.
    2. Click + Add Block and choose the Embed block.
    3. Paste your embed code into the Code Snippet tab, then save and preview.

    For site-wide placement using Code Injection:

    1. Go to Settings > Advanced > Code Injection.
    2. Paste your subscribe form code into the Footer field and save.

    Use this method if your form includes JavaScript or needs to appear site-wide.

    Wix

    1. Go to Add > Embed > Custom Embeds > Custom Element.
    2. Place the element on your page.
    3. Paste the embed code provided by beehiiv and publish the page.

    BigCommerce, WooCommerce, and other platforms

    • Paste the beehiiv embed code into your site's HTML or use an HTML/code block in your editor.
    • For WooCommerce (on WordPress), add a Custom HTML block or widget and paste the code there.

Was this article helpful?

Related Articles