Add a Form to your website
There are several ways to share a form on your website. Below you can learn three methods, which are either to insert a form link on a text, a button or to insert a so-called IFrame code so that the form is placed directly on your site.
Note: You need to copy the link to a form to perform these steps. Therefore, you must have created a form before going through this guide. See here how to create a form.
First of all, copy the link to the form you want to put on the website. Go to Forms > click on a form you want to share > click Copy at the link:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-12-at-13113_ilwgrz.png)
Open the website designer and go to the page where you want to put the form as a link on a text (If you want to create a completely new page, you can read about it here.
Double-click on the text, select the text where the link should be and select the link icon
Then click on ‘Link’
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14253_1mui7pt.png)
Finally, insert the link in the third field like this. Finish with insert.
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14263_1hwr9e.png)
First of all, copy the link to the form that you want to put on the website. This is explained under point 1.
If you don't already have a button, create one, read more here.
When you have a button, you can double-click on it to enter the editor:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14270_11mfeht.png)
You can now select ‘Link type’ and it should be ‘External URL’. The link is placed in the field below:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14273_136daul.png)
Finish by clicking the green button with the tick.
Go to Forms
Open the relevant form
Click on the button ‘</> iFrame code’
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14275_19shaxj.png)
Copy the code in the box:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14280_wu8zq0.png)
Now that you have created the form as an iFrame, go to your website and select a page where you want to insert this form.
Go to the website designer
Click on the page you want the form to appear
Add a new, empty row where you want the form to be:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14282_1txmxk9.png)
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14290_mup2t4.png)
Now add a module in the column - here you need to select an HTML module:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14292_syc88m.png)
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14295_fti5bq.png)
Now paste the iFrame code into the HTML module:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14301_107e64f.png)
Finish with a tick.
You can now see the form directly on the page:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14303_1ts7cs.png)
Always remember to publish by clicking the blue ‘Publish’ button in the top right corner so that your changes can be seen live on the website.
Note: You need to copy the link to a form to perform these steps. Therefore, you must have created a form before going through this guide. See here how to create a form.
1. Paste your form as a link in a text
First of all, copy the link to the form you want to put on the website. Go to Forms > click on a form you want to share > click Copy at the link:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-12-at-13113_ilwgrz.png)
Open the website designer and go to the page where you want to put the form as a link on a text (If you want to create a completely new page, you can read about it here.
Double-click on the text, select the text where the link should be and select the link icon
Then click on ‘Link’
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14253_1mui7pt.png)
Finally, insert the link in the third field like this. Finish with insert.
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14263_1hwr9e.png)
2. Paste form on a button
First of all, copy the link to the form that you want to put on the website. This is explained under point 1.
If you don't already have a button, create one, read more here.
When you have a button, you can double-click on it to enter the editor:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14270_11mfeht.png)
You can now select ‘Link type’ and it should be ‘External URL’. The link is placed in the field below:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14273_136daul.png)
Finish by clicking the green button with the tick.
3. Insert a form directly on a page (as an iFrame)
Go to Forms
Open the relevant form
Click on the button ‘</> iFrame code’
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14275_19shaxj.png)
Copy the code in the box:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14280_wu8zq0.png)
Now that you have created the form as an iFrame, go to your website and select a page where you want to insert this form.
Insert iFrame code on a page
Go to the website designer
Click on the page you want the form to appear
Add a new, empty row where you want the form to be:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14282_1txmxk9.png)
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14290_mup2t4.png)
Now add a module in the column - here you need to select an HTML module:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14292_syc88m.png)
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14295_fti5bq.png)
Now paste the iFrame code into the HTML module:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14301_107e64f.png)
Finish with a tick.
You can now see the form directly on the page:
![](https://storage.crisp.chat/users/helpdesk/website/be3725c5cc2ea800/screenshot-2024-07-17-at-14303_1ts7cs.png)
Always remember to publish by clicking the blue ‘Publish’ button in the top right corner so that your changes can be seen live on the website.
Updated on: 18/07/2024
Thank you!