New universal code for embedding a form on a website
Good afternoon.
Now we have a new universal JS code for embedding a form on your website. The new code supports all types of form embedding:
- As an HTML block on a website page
- As a pop-up window when you click on a button or link
- Automatically open a pop-up window with a delay or when trying to leave the site
- As a widget on the side of the page
For your convenience, we have added a convenient collector, with which you can generate all the necessary methods for embedding a form on a website.
To do this, go to the "Publish" section in the required web form:
On the left in the menu there is a new menu item "Universal code", by going to which you will see the collector.
By default, only the HTML block for embedding on the site is activated. Here you can specify the width and height of the block in which the form will be embedded. If you want the form to occupy all available space, then specify the form width - 100%. The default form height is not set and is calculated automatically depending on the height of the form itself. We recommend using this value.
In addition, you can specify the radius of the rounding of the shape corners and indents.
It is also possible to configure the display of a button instead of a web form on mobile devices, when clicked, the form will open in a pop-up window:
By enabling this switch, you can customize the button appearance and text.
Widget on the side of the page
If you want a widget to be displayed on the side of the page, and when you click on it, the form will open in a pop-up window, then activate the corresponding switch in the builder:
Here you can specify the widget text and customize its appearance. In addition, the switch for opening the form in a pop-up window is automatically activated, where you can customize the appearance of the pop-up window: width and height, radius and background color of the substrate.
Additionally, in the pop-up window settings, you can enable preloading of the web form. With this setting, the form will load automatically after the page loads, and when there is a need to show the form in a pop-up window, it will be displayed instantly, without a loading indicator.
If you want the pop-up window to appear automatically after a specified period of time, then activate the "Open pop-up window automatically" switch.
You can also set up a pop-up window to open when you try to leave the site. As soon as the mouse cursor leaves the window, the user will see a pop-up window with a form.
After all parameters are configured, click on the button "Get code to insert", after which you will receive a ready-made code for embedding on the site.
It consists of several parts, depending on which options you have chosen.
The first code is the initialization code, which only needs to be placed once per page in the <head></head> section:
All web form settings are listed here. If you have enabled the HTML block on the site, you need to add another code to the place on the page where the form should be displayed:
To open a form in a pop-up window when you click on a button or link, you need to use the following code:
On the left in the menu there is a new menu item "Universal code", by going to which you will see the collector.
By default, only the HTML block for embedding on the site is activated. Here you can specify the width and height of the block in which the form will be embedded. If you want the form to occupy all available space, then specify the form width - 100%. The default form height is not set and is calculated automatically depending on the height of the form itself. We recommend using this value.
In addition, you can specify the radius of the rounding of the shape corners and indents.
It is also possible to configure the display of a button instead of a web form on mobile devices, when clicked, the form will open in a pop-up window:
By enabling this switch, you can customize the button appearance and text.
Widget on the side of the page
If you want a widget to be displayed on the side of the page, and when you click on it, the form will open in a pop-up window, then activate the corresponding switch in the builder:
Here you can specify the widget text and customize its appearance. In addition, the switch for opening the form in a pop-up window is automatically activated, where you can customize the appearance of the pop-up window: width and height, radius and background color of the substrate.
Additionally, in the pop-up window settings, you can enable preloading of the web form. With this setting, the form will load automatically after the page loads, and when there is a need to show the form in a pop-up window, it will be displayed instantly, without a loading indicator.
If you want the pop-up window to appear automatically after a specified period of time, then activate the "Open pop-up window automatically" switch.
You can also set up a pop-up window to open when you try to leave the site. As soon as the mouse cursor leaves the window, the user will see a pop-up window with a form.
After all parameters are configured, click on the button "Get code to insert", after which you will receive a ready-made code for embedding on the site.
It consists of several parts, depending on which options you have chosen.
The first code is the initialization code, which only needs to be placed once per page in the <head></head> section:
All web form settings are listed here. If you have enabled the HTML block on the site, you need to add another code to the place on the page where the form should be displayed:
To open a form in a pop-up window when you click on a button or link, you need to use the following code:
How do you like our new universal code? Share your impressions in the comments below!
