Embed a signup form in your website

Permission required to use this feature: lists and subscribers > add new subscribers

Embed a customizable signup form that enables you to collect subscribers directly from your website. This option is ideal for those who want full control over the form’s appearance and signup process. You can choose to include built-in styles and customize the form using our builder, or use the raw HTML and apply your own CSS for complete design flexibility.

Please note: Setting up this type of form may require some familiarity with HTML and CSS. If you prefer a code-free solution, consider using our Signup page.

How to create an embedded form

You can create embedded forms using two different methods, either via a list, or via the signup forms page.

Create an embedded form via a subscriber list

1. Click Lists & subscribers, then click on the relevant list name.
2. Select Signup form builder from the left menu.

If your list already contains one or more signup forms, the most recently saved form will be loaded. To switch to editing an embedded form, click Select form type. In the dialog that appears, choose Embedded form, choose whether to include styling, then click Select.

Create an embedded form via the signup forms page

1. Click Lists & subscribers.
2. Click Signup forms in the left menu.
3. Click Create a signup form.
4. In the ‘Select how to create your signup form’ dialog, select Start from scratch.
5. On the ‘Create a signup form’ screen, select a list, click Embedded form, choose whether to include styling, then click Continue.

If you see a banner on the ‘Create a signup form’ page informing you that the list already has one or more signup forms, you can either click Continue to proceed or select a different list to create your signup page before clicking Continue.

If you proceed after seeing the banner and a predesigned embedded form loads, it means an embedded form has previously been saved for the selected list. You can create a new embedded form for the same list without affecting any previously generated forms. However, you may want to back up the existing form’s code before making changes. To do this, click Save. In the dialog that appears, hover over the code, click Copy, then paste the code from your clipboard into a text document.

If a different form type loads, click Select form type to switch to your list’s embedded form.

Customize your embedded form

You can preview your form on the same page; any data entered here won’t be added to your list.

Form

Under this tab, customize the sign up form displayed to potential subscribers. Note that this tab will need to be selected to access the Fields and Options sections, which we'll cover later in this document.

If you chose to not include styles you will be able to modify the following:

• Heading and logo – Customize the heading text or optionally upload a logo image.
• Description – Add an optional description to your form.
• Button text – Customize your button text.

If you did include styles, in addition to the options above, you will also be able to edit the following:

• Background – Set the form page background color. 
• Description – If you add an optional description, you can customize the font family, font size, and text color.
• Label – Set the font family, font size, and text color for labels.
• Button – Personalize your button text, font family, font size, background color, and text color.
• Checkbox – For forms with multiple options (select many) custom fields, multiple list opt-ins, or permission options, customize the checkbox font family, font size, and text color.
• Link – If your form includes policy links, you can adjust the font family, font size, and text color.

Fields

You can access this section while the 'Form' tab is selected.

If your subscriber list includes custom fields, they will appear below the default Name and Email fields. To add more custom fields, click Add new field.

Select the fields you want to include on your form, and check the Required box to make them mandatory. You can also reorder custom fields by using the drag handle on the left to move them up or down.

Options

You can access this section while the 'Form' tab is selected.

Opt in to multiple lists

You can add multiple lists to your signup page, allowing subscribers to opt into more than one list. If lists share custom fields with identical names and types, the data will automatically populate across all selected lists.

To avoid confusion, ensure that all included lists use the same opt-in type—either all confirmed opt-in or all single opt-in. For confirmed opt-in lists, subscribers will receive a single confirmation email covering all selected lists.

Permissions and policies

You can display checkboxes for email and tracking permissions and customize their labels, allowing subscribers to opt into email communications and tracking. This lets potential subscribers explicitly choose whether they want to receive emails and allow tracking of email opens and clicks.

Additionally, you can include links to your privacy policy and cookie policy.

Language

Changing the language setting updates default field labels Name and Email, as well as error messages.

However, all other content must be updated manually:

• Custom field labels – If the field names are in English, they will appear in English on your form. To edit custom fields, go to your subscriber list page and click Custom fields in the left sidebar.
• Editable text – Any default text in editable fields, such as the heading, description, and labels for permissions and policies checkboxes or links, will not automatically update to your selected language. Be sure to manually update this text in the signup form builder to match your chosen language.
• Verification email content – This applies to confirmed opt-in lists. The verification email sent to subscribers is in English by default. To edit this email, open your subscriber list page, click Settings in the left sidebar, then under Subscribe options, click Edit next to Confirmed opt-in email.

Mobile number and SMS consent

If you have enabled SMS campaigns, you can display the Mobile number field and an SMS marketing consent checkbox on your form. See Collecting mobile numbers to grow your SMS subscribers.

Success page

After a form is successfully submitted, subscribers will be directed to a subscription success page of your choice. Click the link under this tab to go to the subscriber list settings page, where you can specify the page they will see.

Save your embedded form and generate the code

Once you have finished customizing your form and are ready to add it to your site, follow these steps:

1. Click Save.
2. In the dialog that appears, hover over the code and click Copy.
3. Paste the code into your website’s HTML.

If you are not responsible for updating your site, paste the code into a document or email and send it to your developer or web team.

Further editing the form code

After generating the signup form code, you can manually adjust the HTML. However, do not remove these elements, as they link the form to your list:

• The form action.
• The email field, which is required.
• Unique identifiers, which look like name="cm-f-jrddhr" and label for="fieldulyhlr"

reCAPTCHA is built in by default

If a subscriber is suspected of being a bot, a reCAPTCHA prompt will appear. You can also configure reCAPTCHA to prompt all subscribers by setting the email input’s name attribute to "email":

<input id="fieldEmail" name="email" type="email" class="js-cm-email-input" required />