Integrating Forms

There are several integration options for Spotler forms and surveys:

1. Placing a piece of javascript code from Spotler
   You can copy a piece of Javascript code from Spotler from every form in a Spotler account and paste it into (the HTML of) the page of your CMS system. This script ensures that the form is retrieved from Spotler the moment a visitor lands on this page. The validation javascripts are also included.
2. Placing a form on a Spotler web page
   The other option is to place a form on a Spotler web page. This page is therefore separate from your website. This can be useful if you can't easily add a form in your CMS.
3. Integrating forms via an API
   The last option, is by using the API. Your CMS system can retrieve forms from Spotler via the API and display them the moment the visitor lands on the page. This has a number of advantages over the other integration options. You can fully utilize the functionalities of the Spotler forms, such as server-side validation, conditional questions (branching) and multi-page forms. In addition, unlike the first two integration options, you no longer have to manually retrieve HTML or Javascript from Spotler.

Form on your website using javascript and html

There are a number of conditions to be able to integrate forms on an external web page:

• The form or survey may consist of one page
• It cannot contain a thank you page from the Forms module
• Only the type of form or survey: 'Subscribe' and 'Normal' work

Do you want to use a form or survey that consists of several pages? Then use a Spotler webpage.

To download the code for integrating a form, go to Integrate under the dropdown menu in the overview.

The next screen appears:

You can integrate the form in two ways:

• Dynamic
• Static

With the dynamic option, the changes that take place in the form are immediately implemented on the website. This is not the case with a static form. After a change in Spotler you will have to insert the code again on your website.

By default, only the Dynamic integration method is selectable. This has to do with the fact that the anti-bot security of a form is on by default. This option is only available for dynamic forms. 

Note: Dynamic Spotler forms use a number of (jQuery) scripts for correct operation. It is possible that your website does not support this properly. One solution might be to deploy the Static form. The use of scripts is then optional.

In step 1 of modifying the form, turn off the anti-bot protection so that you can export your static version. There is no longer standard bot protection on your form, but you can apply it yourself by means of reCaptcha. 

If you don't know which choice to make when it comes to type of HTML, ask your website builder.

You also have the choice of code that is built with tables or without tables. In both cases you can completely style the form yourself. If you want to have complete freedom over the layout of the form, you can choose generation without tables.

Save and view code for integration form
When exporting the form files, choose where you want to save them on your computer. It is one zip file.

Then open the zip file. In the case of a dynamic form you will see two html files:

You need both. Open the html file in your browser by double clicking on the file or right-clicking on Open.

A white screen will open in your browser. You can find the code of the form by right-clicking on View source code/View page source.

You will then see the code that you can implement on your website. This method applies to both files.

Does the form look neat? A Spotler form automatically takes over the styling of the website on which the form is placed. Does the form not look neat? Then form styling probably needs to be added by the website builder. For more tips, read the How can I change the layout of my forms?

Support form Are you having trouble implementing your form on your website? Then contact your website builder. Spotler Support cannot offer support on your website, but only on the operation in Spotler Mail+.

Placing a form on a Spotler Web page

Drag a form or survey block onto the canvas of your web page via the Editor-options.

Double-click on the block and a dropdown menu will appear with the forms in your Spotler account.

 

The form will then be showed on your web page.

Form via an API

We have several technical documentation for using the REST API. If you want to get started with a REST API and forms, read more about Integrating forms under the API documentation.