If you want to collect contacts straight from your website, there is nothing easier than using our web sign up forms.

In this article you will find:

1. Types of Ecomail signup forms

2. Embedding the form on the web

3. Connection via API

4. Double opt-in

5. Redirection after registration in the form

First, select one specific list from your imported contact lists to which you want to direct the collection of contacts.

Then click on the "Signup forms" tab on the left:

Here you create a new signup form and select the type (embedded, pop-up or slider).

The last step is to select a preset style, or you can choose your own form design and create your own from a blank form (Start from scratch).

First, we recommend decide to which type of form you want to use - and then plan it accordingly and set the overall design. You choose from:

Embedded - static or hosted form

Pop-up form

Slider

You insert the basic static form on your website anywhere, but most often in the footer of the website or in the side menus. This is a more neutral and non-violent way of communicating to receive your news, as the form does not appear in the middle of the screen over other messages.

If you only want to link to the form, just have the form selected as the embedded and then click on "Use this form". A window will pop up in which, in addition to the form script, there will also be a link to the hosted form. All you have to do is copy and paste it as you wish, for example on your website, in a button, etc.

This form, which is one of the most popular, is displayed in the middle of the page after a certain condition is met, for example after 5 seconds spent on the page, or when leaving the page, etc. After closing the pop-up, the form will not be displayed again unless the user clears the browser cache. Therefore, we recommend combining a pop-up and a basic form. This is also because pop-ups cannot be displayed on mobile devices.

The form that pops up when you click on the button in the lower right corner. Compared to the pop-up, together with the embedded form, the slider has the advantage that it does not disappear completely after closing. This makes it easy for the user to subscribe again. Even on a mobile device, unlike regular pop-ups.

Of course, content is also needed to create the form. Whether it is text, image, button, space, or messenger. As in the editor, here you have the option of "drag & drop" - ie simply drag the content into the form body to the place where it suits you best and then edit the content.

A field is a window in which information about a contact is entered - for example, email, name, address or even your custom field. The field type can be text (any string), email (must be email format) or checkbox.

The title appears above the field, the placeholder is the default text content in the field. For example, "Enter your email here".

If you select the field as required, then it must be filled in by the user, otherwise it will not be possible to submit the form.

The specific type of field is then the "hidden" field. This field will be hidden in the form (the user will not see it) and you can send the set value to each logged in contact.

Example: If you have a website in the ENG and DE versions, you can create two identical forms, when first hidden field will contain "Field - country, value - ENG" and the other form will have "Field - country, value - DE".

You can also use your own field as hidden.

After inserting the text, you can change the text size (preset paragraphs and paragraph sizes), font, alignment, etc. in the toolbar.

The last button on the right of the toolbar (see screenshot) is "Source code", ie the ability to edit the source code of the text. This opens up the possibility of letting your programmer edit and past your own code. However, we recommend that you stick to the basic adjustments so that the form works correctly.

The most important element in an image is its size and indentation. It is good to stick to rather smaller dimensions depending on the used image. Too large image would stretch the form and it would not be user friendly.

If you turn on image cover, it will automatically enlarge to cover the entire contents. We only recommend this for images that have their own background and are planned to fill one page of the form.

The button is primarily used to submit the filled form. However, this is not the only option - it is possible to set the type of button to close the form, or use it as a link to any web page.

Expanding a button stretches the button across the entire width of the form with a certain indentation from the sides.

The space is used to insert free space, usually between two objects (but we don't want to separate the other side, otherwise we would use the classic top and bottom indentation).

Just as you can edit the source code for text, you can insert HTML content directly into the form and then edit it in the window in the left menu.

Here you can set the colors of the background (around the form), the form, the texts and the links. You can also upload your own background image.

Here you can turn on the shadow of the form or increase the rounding of the edges (and create even a completely round pop-up) and set the internal indentation of the entire form.

You can choose from 3 types of form layouts:

A cell is a space into which content can be inserted. Of course, the image can be replaced with other content, these are only preset contents for faster work.

Once the form is ready and you want to embed it on the web, just press "Use this form" in the upper left corner and you will see the code (script) for embedding it on the page. This script is placed in the body of the site (between tags).

You can also send new contacts to the application via the API.

API documentation is then available here.

Using this function, an email will be sent to your customer immediately after registration to the specified email address, where he must confirm its existence and functionality. The advantages of using so-called double confirmation are the creation of the correct database without typos, prevention of false registrations, protection against accusations of sending spam and, last but not least, an increase in the number of emails received.

In the contact list settings, you can insert a redirect page immediately after registering the contact in the form. After filling in the data, you will immediately redirect the customer back to your website, for example, without using the second step of the form.

Do not forget to add a confirmation of successful registration of the email address (from the form) to the page to which you will redirect the contacts, or inform the contacts about the need to complete the registration in the email (double opt-in, see point 4), as most contacts may not see a second thank you page in the form, where this information is typically provided.

If you have any further questions regarding collecting contacts with Ecomail, you can contact us at support@ecomail.app

​