When you create a form in MessageDesk we automatically generate code so you can easily embed it into your website.
Embedding your form drives:
Easy lead collection
Simple event registration
Sign-up's to receive promotional material
Collection of information you need when you add Custom Fields.
First, navigate to the form you are going to embed into your website. If you haven't made a form yet, read our guide on how to create one.
Once you are on your form's dashboard, select Preview.
In the section Embed Form on Website, there is a clipboard icon to the right of the code that will be embedded into your website.
Click on the clipboard icon to copy the code so it is easy to paste into your website.
Embedding the Code into Your Website:
If you have a web developer, send them the code you copied and tell them which page you would like it to be on.
If you are going to insert it into your website yourself, we have instructions below for some of the website hosts you may be using. But before you keep reading here are some general instructions that apply to all websites.
Here is an example of a Form code. You will notice that in the last piece of it the fields height= and width= both have the label "undefined". You will want to edit this to how big you will like the form to appear on your website.
<iframe src="https://form.snapdesk.app/?type=dynamicform&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ0ZW5hbnRfaWQiOjM4NCwidXVpZCI6ImpqSFR2WnVqIn0" height="undefined" width="undefined" style="border-radius:25px;"></iframe>
A good starting point is to insert "750px" for both fields. Depending on how that looks on your website, you can adjust that number as necessary.
If you want to center your form on the page, insert this piece of code before the code for your form.
It should look like this when you are done:
<p align="center"><iframe src="https://form.snapdesk.app/?type=dynamicform&token=eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ0ZW5hbnRfaWQiOjM4NCwidXVpZCI6ImpqSFR2WnVqIn0" height="750px" width="750px" style="border-radius:25px;"></iframe>
Click on the button that corresponds to the website host you use:
Or, read below for WordPress.
How to Embed your Form on WordPress:
In your WordPress admin site, start by navigating to Pages. Click on the page that you would like to embed your form in.
Select the Text tab to edit the page.
Insert the Form code that you copied to your clipboard in the text box. Of course, you will probably have code in there and not just a blank page. Remember, you're going to want to edit the height= and width= fields to fit your page.
Here's what it looks like!