Register

How can I create and add a subscription form on my website and link it to my Moosend mailing list?

A subscription form is one of the most useful elements to include in any website or landing page, helping you to grow your mailing list and, therefore, your business. Your Moosend platform now allows you to create beautiful, stylish and effective subscription forms quickly and easily! The Moosend Form Designer is a powerful tool with hundreds of design options available to you, so that you can create the subscription form of your dreams time after time!

There are many different, super-cool types of subscription form to choose from. In this example, let's take a look at how to create a Modal Pop-Up subscription form.

 

1. Click on Lead Generation, located on the left side of your Moosend account page.
Adding_a_SF_to_your_website_1.png

2. Hover your mouse over the Create button to reveal the drop-down menu, then click on Create Subscription Form.
Adding_a_SF_to_your_website_2.png

3. Click on the 
Create button located to the right of the Modal Pop-up subscription form option.

Adding_a_SF_to_your_website_3.png

 A. Defining the subscription form settings

In the Basic Settings step, type in a name for your subscription form, then click Next to continue.
Adding_a_SF_to_your_website_A_1.png

Your subscription form's name is for your internal use only and will not be seen by visitors to your page.

B. Creating the template

1. In the Layout and Content step, click on the Take me to the Designer button to access the Form Designer and start working on your subscription form design.
Adding_a_SF_to_your_wesbite_B_1.png

2. Once you are inside the Form Designer, browse subscription form templates in the Template Library to find one to use as your starting-off point.
Adding_a_SF_to_your_website_B_2.png


3. Once you have found a template you like, click on the Use Template button located to its right to apply it to your design.
Adding_a_SF_to_your_website_B_3.png

Then, use the
 numerous settings options available to tweak your selected template to your heart's content!


4. Once you are completely satisfied with your subscription form design, click on the Proceed to Next Step button in the upper-right corner of the Form Designer page.
Adding_a_SF_to_your_website_B_4.png


5. A pop-up window appears, asking you to confirm that you wish to continue to the next step. Click on the Ok button to continue.
Adding_a_Sf_to_your_website_B_5.png

C. Defining the visibility settings

1. In the Visibility Settings step, choose when you would like the subscription form to be displayed.
Adding_a_SF_to_your_website_C_1.png

Your options are:

  • Upon visit
    When you select this option, the subscription form is displayed when someone visits the page, after a set amount of time that you specify.

    i. Use the first and second fields (the second field is a drop-down menu) to specify the number of SecondsMinutesHoursDaysWeeks or Months that need to have passed since the visitor last viewed the form.


    ii. Use the third drop-down menu to specify the amount of time that should pass before the form is displayed to returning visitors (assuming the criteria previously described have been met).

  • Upon Exit
    When you select this option, the subscription form will be displayed when someone is about to leave the page. You will need to specify the number of Seconds, Minutes, Hours, Days, Weeks  or Months that need to have passed since the visitor last viewed the form.

  • On Click
    When you select this option, the subscription form will be displayed when a user clicks on specific text within your web page.
    Adding_a_Sf_to_your_wesbite_C_2.png


For example, if you just use the code provided, when a user clicks on the clickable text "Activate Click Trigger", the Modal Popup form will open!

Click on the Copy button to copy the code snippet which appears and then paste it into your website's code. Note that once you have pasted the snippet into your website's code, you can either retain the default text or else alter it to say whatever you want it to say!

2. Next, you can choose to hide the subscription form entirely from visitors who have already submitted it. To do this, toggle the Avoid submission repetition option to On (this is the default option).
Adding_a_SF_to_your_wesbite_C_2_b.png

3. You can also choose Advanced Conditional Visibility Settings for your subscription form.
Adding_a_SF_to_your_website_C_3.png

This setting gives you the option of setting rules for showing your form, for hiding your form, or for both, if you wish! 

 

To set rules for showing your form, follow the steps below:

i. Click on the Conditional rules for showing the form tab.
Adding_a_SF_to_your_website_C_3i.png

ii. Specify if the form should be displayed when All or Any of the criteria are present, using the drop-down menu.
Adding_a_SF_to_your_website_C3ii.png

The option All will display the form if all the rules added are true. 
The option Any will display the form if at least one of the rules added is true.

iii. Use the Add rule button to add the rule(s) you wish, and fill in the relevant fields to define them.
Adding_a_SF_to_your_website_C_3iii.png

You have the following options:

  • URL Path
    To set a rule based on a specific URL path, choose URL Path from the first drop-down menu, specify whether the path is /is not / contains / does not contain / starts with / does not start with /ends with /does not end with and then complete the rule by typing the appropriate URL path into the third drop-down field and then press the enter button to add the value. Please note that this url path is after your domain. 
  • Cookie
    To set a rule based on a specific cookie name, choose Cookie from the first drop-down menu, specify whether it is /is not / contains / does not contain / starts with / does not start with /ends with /does not end with and then complete the rule by typing the appropriate value into the third drop-down field and then press the enter button to add the value.
  • Country
    To filter visitors based on their country, choose Country from the first drop-down menu, specify whether it is/is not and then choose the country from the drop-down list of available countries in the third field.
  • Device Type: You can filter visitors based on whether they are viewing through their mobile phone or their desktops. Choose the condition Device Type from the first drop-down menu, select whether this is/is not, and then, from the third drop-down field, select either Desktop or Mobile.
  • Operating System: You can filter visitors based on the operating system they are using. To do that choose the condition Operating System from the first drop-down menu, and in the second drop-down menu specify whether the OS is / is not and then choose from the drop-down list of popular operating systems in the third field. 

To set rules for hiding your form, follow the steps below:

i. Click on the Conditional rules for hiding the form tab.
Adding_a_SF_to_your_website_C3iv.png

ii. As before, specify if the form should be hidden when Any or All rules apply, using the drop-down menu.
Adding_a_SF_to_your_website_C3v.png

The option All will display the form if all the rules added are true. 
The option Any will display the form if at least one of the rules added is true.

iii. Use the Add rule button the add and define the rule(s) you wish, as before.
Adding_a_SF_to_your_website_C3vi.png

Please note that any rules for hiding your form that apply, will prevail over rules for displaying your form.

D. Publishing your subscription form

In the next step, you can automatically publish your form on an active Moosend landing page or on your website that is connected with your Moosend account and is verified.
Adding_a_SF_to_your_website_D.png

1. To publish your form on an active landing page or on your website that is connected with your Moosend account, toggle the Publish on my Moosend Website option to On.
Adding_a_SF_to_your_website_D_1.png

2. Then, select your Moosend website or your landing page from the drop-down list which appears. Note that in order to see a landing page in the list here, you need to make sure that is active and for the websites, they need to be verified.
Adding_a_SF_to_your_website_D_2.png

3. Click on the Embed or Publish to External Platforms tab to to publish your form in 3rd party platforms.
Adding_a_SF_to_your_website_embed_external_1.png

i) Click on the Setup button located next to the Link to your form option.
Adding_a_SF_to_your_website_embed_external_2.png


ii) in the first field, select one of the available domains for your subscription form.
Adding_a_SF_to_your_website_embed_external_3.png

In the second field, you may, if you wish, edit the rest of your URL path.

iii) Click on the Setup button located next to the Embed your form option.
Adding_a_SF_to_your_website_embed_external_4.png

Note that in case your website is already connected with your Moosend account, it's not necessary to add the provided code to embed your form. You can just use the option Publish on your site as explained above on D1 and D2.


iv) Click on the Copy button to copy the code snippet that appears and then paste it into your website's code.
Adding_a_SF_to_your_websit_embed_external_5.png

Note that since this option excludes our website tracking code, any submissions and views for an embedded form will not be counted in its total statistics.

E. Success actions
Adding_a_SF_to_your_wesbite_E.png

 F. Your subscription form summary

This is a summary of your subscription form setup, as well as an easy way to see if anything is missing from your subscription form.
Adding_a_SF_to_your_website_F.png

There will be a red "X' in any fields with missing information.

Make sure to check out the super-easy instructions on how to create Inline, Floating Bar, Floating Box and Full Page forms, as well!