All Collections
Signup forms
How-to articles
Create a signup form (detailed version)
Create a signup form (detailed version)
Zaklina Udovicic avatar
Written by Zaklina Udovicic
Updated over a week ago

In MarketHype, you can create one or several signup forms to add to your website or share as a URL link.

How-to video


Step 1: Build the form


To create your form, go to Audience → Signup forms and click on Create form to get started.

When entering a signup form, you end up under the Build tab, where you will create and edit the form.

A panel on your left-hand side contains different elements you will use to build it. In the middle, you have the design area, where you add the different elements by clicking on them.

You will see that there are already three elements added to the design area from the start. Those elements are mandatory and necessary for the form to function.

  • An email field

    Necessary for creating new contacts from submissions.

  • A subscriptions element

    To specify which subscriptions should be given to anyone submitting the form.

  • A submit button

Optional elements available are:

  • General contact attributes

    Use those to collect contact properties from the subscriber. Suggested properties are First and Last names, but you can add address elements, etc.

  • Custom contact attributes

    Custom attributes are created by your organization based on your needs. These attributes will help you add additional value to a contact who subscribes through your signup forms in order to segment your audience further. You can click here to learn how to implement these attributes in your signup form.

  • Privacy policy checkbox element
    Use this element if you want your subscribers to confirm that they accept your privacy policy. The checkbox will be required for them to confirm when subscribing. You can also insert a link to your privacy policy on your website if they want to read more.

  • Text element
    If you want to include rich text in your forms, such as an instruction, a conditions statement with a link to your terms, or just a shout-out to your visitors. Contrary to other elements, the text element can be added multiple times in your form.

ℹ️ Since submitted data about the visitor will be stored and processed in MarketHype, we highly recommend that you include a Privacy Policy checkbox or a text element with information about this in your forms.

Add elements to your form

Add an element to the design area and use drag and drop to change its position. Choose if you like to add a placeholder text and if this element should be required for the subscriber to fill in.

The header of the edit panel contains the name of the element you are editing and a close button to close the edit mode. All optional elements also contain a remove button.

Step 2: Choose subscriptions


A visitor who submits to your form gives their consent for you to communicate with them. Therefore, you need to specify which subscription type you want these contacts to end up in.

Subscriptions can be assigned in three ways:

  • Automatically by including a hidden checkbox that will be checked for all visitors who submit to your form. This is useful if you don't want your users to explicitly confirm a specific subscription but rather want the action of subscribing to be obvious enough for users to automatically be assigned a subscription.

  • Letting your visitors choose. This is useful if you have subscriptions based on interests, for example, and want your visitors to be able to choose what communication they want. For example, your weekly lunch menu or tour dates.

  • A combination of both - basically assign a subscription like Newsletter automatically but let users choose additional subscriptions they might want.

The block Click to specify subscriptions will open up the edit panel for Subscriptions.

Subscriptions element

From here, you can Choose subscriptions and select the ones you want to include. Each added subscription can be edited, and if you add multiple subscriptions, you can change the order by using drag and drop.

Editing a subscription opens up the edit dialog. In this example, we are editing a subscription type called Newsletter. We can now specify a label to show next to the checkbox for that subscription, and we can choose to have the checkbox selected by default. If you want a subscription to be assigned automatically without the user checking a checkbox, you can choose that option here.

Edit hidden subscription dialog

The checkbox will now be part of your form but not visible to your visitors. Hidden fields are shown in your editor for clarity but will not be visible when the form is rendered on your website.

Hidden field

Step 3: Form settings


The second tab in the form editor is Settings, where you can configure your form.

Form settings

Submit Feedback

Here you specify what should happen when the form is submitted - either show a "Thank you" message or redirect the user to a page on your own website.

Language

The language setting affects which language your form will be displayed in, your input field labels, form validation error messages, etc. Most of these texts can be modified if you wish, as we've seen above for your input field labels, thank you message text, etc.

Double opt-in

All forms in MarketHype have double opt-in enabled. This means that any visitor submitting your form will be sent a confirmation email where they are asked to confirm that they want to subscribe by clicking on a button. This is important for many reasons, including:

  • GDPR compliance - all subscribers will confirm that they want to subscribe, and no contacts will be created from submits that could have been triggered by someone else but the owner of that email address

  • Data quality and sender reputation - no email addresses will pass through the signup form and end up as contacts in your Audience without being verified as deliverables since they are verified in the double opt-in process

  • Interested recipients only - since no one can be subscribed without confirming the subscription, all subscribers from your signup forms are verified as interested recipients of your emails

You can customize the sender and subject of the confirmation email that is sent to visitors who subscribe.

Name

Finally, it is convenient to specify a name for your form, which makes it easier to find if you have multiple forms later on. The name of the form is only used in MarketHype and is not something your visitors will see.

Step 4: Styling


Style is the last tab in the form editor. All forms will have default styling that makes them look good from the get-go, but you can customize them in this tab.

Form style

There are two options for applying form styling:

  • Write CSS styling in the CSS editor

  • Provide a link to an external CSS file on your website

To let a web studio style your form, you can share the code or a link to your form and let them see the form easily when styling it. As a starting point, it could also be convenient to copy and send the default styling as shown in the style tab.

Step 5: Publish your form


There are two share options to choose between:

  • copy the embed code to embed the form on your website and its design, for example, in the footer.

  • copy a URL link to share your form as a separate page.

Click on Save and publish, and a review box will appear to show any warnings or recommendations. When ready, click on Publish, and use the embed code or URL link to share your form.

Review and publish

Once published, your changes will be visible when you add the form code to your website. You can now either copy the embed code for embedding the form on your website or copy a share link that shows the live form on a separate page.

Embed published form

Did this answer your question?