General Design and Settings

To edit the embedded subscribe form, go to Subscribers (click on the list) → Enrich → Subscribe. Click 'Start' under the heading 'Embedded subscribe form' (even if you want to edit) and then click 'Configure' on the primary page of the form. You will see the editor for the form.

General procedure

• Click on the different parts of the form to change them. On the left side of the screen you will see the set-up options, with the tabs Content and Design at the top.
• Under Content, you enter the texts, and for example choose which fields are visible, or select an image.
• Under Design, you can adjust the colours, fonts, margins, etc.
• Do keep clicking around! You will find all kinds of possibilities.

Different design for desktop and mobile

For smaller screens, the design has to be different than for the desktop. For instance, text must be larger, and components are displayed under each other, instead of side by side. In the editor, there are several places to switch between the different displays.

Preview

Are you curious what the form will actually look like? Click the Preview button at the top right of the screen. While viewing the preview, you can switch between regular and mobile display.

Undo/redo

While working, you can always move to the previous state or move forward again by clicking the Undo and Redo buttons at the top of the screen.

Global form layout

By clicking the white field next to the form, you will see the global settings. Here, you can click which general settings the form should have. To do so, click the icon with the settings you are looking for.

Form width

By clicking in the white field next to the form, you will see the global settings. Then click the Design tab. Here, you can indicate whether the form should have rounded corners.

[screenshot]

Form settings: inline, pop-up or slide-in

By clicking in the white field next to the screen, you will see the global settings. Next, click the Settings tab.

By default, the form is shown where the javascript code is placed; we call this 'inline'. However, it can also be shown as a pop-up (visible in the middle of the page, over the content) or as a slide-in (the form slowly slides onto the page).

You can choose this under 'Form placement' (for the slide-in, you can also indicate where).

Click Preview (top right) to see how the form will look on your website.

[screenshot]

When to show the form?

By clicking the white field next to the form, you will see the global settings. Next, click the Settings tab.

By default, the form is shown directly on the page of your website when loading. Under 'When to show the form?' you can choose a different option:

• Show after some time (a few seconds after loading the page).
• Show upon exiting the page (the form is invisible, until your visitor leaves the page with their cursor. The form is then shown).
• Show after scrolling (the form is invisible until the page has been scrolled down for a percentage set by you).

You can also combine these settings.

[screenshot]

When to hide the form?

By clicking the white field next to the form, you will see the global settings. Next, click the Settings tab.

By default, the form is hidden when it has been submitted. Under 'When to hide the form?' you can choose a different option:

• Hide after closing (clicked away). With this, you can indicate of the form should be shown again after a certain amount of time.
• Hide after showing. With this, you can indicate if the form should be shown again after a certain amount of time.
• Hide after a number of times. You can set this amount.

You can also combine these settings.

[screenshot]

On which pages of your website?

By clicking the white field next to the form, you will see the global settings. Next, click the Settings tab.

By default, the form is active on all pages where the code for the form has been placed. Under 'Which pages of your website?' you can indicate which pages the form should or should not be shown.

For this, you can enter 'paths' (parts of the URLs on your website) where the form should be visible, or not. You can make use of wildcards (a '*'). For example, contact/* means: all pages starting with contact/.

[screenshot]

Show/hide with javascript

By clicking the white field next to the form, you will see the global settings. Next, click the Settings tab.

Aside from the settings in our application, you (or your web builder) can also determine when the form should be shown or hidden with javascript. The code for this is under the header 'Show/hide with javascript'.

[screenshot]