Embed a signup form in your website

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

Embedding a customizable signup form enables you to collect subscribers directly from your website. Generate the HTML and JavaScript in our app, and customize the form using our builder, or apply your own CSS styling. Note that this type of subscribe form requires some knowledge of HTML and CSS.

For a code-free option, consider our Signup page.

How to generate embedded signup form code

1. Click Lists & subscribers, then click on the relevant list name.
2. Click Signup forms in the left menu.
3. Select Paste code onto your site from the options listed.
4. Choose either Include styling or No styling.
5. Use the editing tools to customize your form and then click Save and generate code.
6. Copy the HTML code and paste it into your website.

Customizing your embedded signup form

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

Styling

Choose whether to include embedded CSS styles in the generated code.

• If you include styling, a Styling tab will appear, allowing you to control colors and fonts. The form builder preview will show how the form will look once embedded in your site.
• If you opt for no styling, the preview will display only a basic version of your signup form, with your site’s CSS determining its final appearance.

Page header and logo

Under the Content tab, choose between a text heading (up to 255 characters) or upload a logo image.

Description and button text

Add optional description text and customize the button text to fit your branding.

Fields

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

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

Including additional opt-in lists

Add other lists to the signup form, allowing subscribers to opt into multiple lists. If lists share custom fields with identical names and types, data will populate across all selected lists.

To avoid confusion, ensure all included lists use the same opt-in type (either all confirmed opt-in or all single opt-in). For confirmed opt-in, subscribers will receive a single confirmation email for all lists.

Permissions and policies

Under Options, you can display checkboxes for email and tracking permissions and customize their labels, allowing subscribers to opt into email communications and tracking. This enables potential subscribers to explicitly choose whether they want to receive emails and permit tracking of their email opens and clicks.

Additionally, you have the option to include links to your privacy and cookie policies.

Language settings

Changing the language setting updates default field labels Name and Email, along with error messages.

All other content must be manually updated to your chosen language:

• Custom field labels — If the field names are in English, they will appear in English on your signup form. To edit custom fields, go to your subscriber list page and click Custom fields in the left sidebar.
• Confirmation pages — Generic success and unsubscribe pages are in English and cannot be changed. You will need to set your own, custom confirmation pages within your chosen language. See Confirmation pages for subscribe and unsubscribe for further instructions on how to do that.
• Verification email content — This applies to confirmed opt-in lists only. The verification email, sent to subscribers to confirm their subscription, 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 SMS campaigns are enabled, you can add a Mobile Number field and an SMS Marketing Consent checkbox. See Collecting mobile numbers to grow your SMS subscribers for more details.

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 />