Ready to put your Web Form Builder form into your VSD website project? You've got three different options, depending on how you're planning to publish your form.

Adding Your Form When Publishing to S-Drive

If you use the Publish toolbar icon to put your form online, good for you! Publishing to S-Drive is the easiest possible way to put your form on the web—and to put it into a VSD project.

When you publish, the Form Successfully Published window will appear with a section that contains a script you'll need to use. Look for it under the heading "Add Your Form to a Website":

Simply click the Copy to Clipboard button to copy the code, then click the Add HTML button in VSD:

This opens the Insert HTML window. Label the form by entering a name in the HTML Object Name field, then paste the code into the text area below the Body HTML tab:

Click OK and your object will be placed on your VSD webpage. Position it where you like, then click the Preview toolbar button to see it in action!

Click here to learn how to display your form in a pop-up over your webpage.

Adding Your Form When Exporting with Automated Form Processing

When you export your form using the Automated Form Processing option, you'll still get to read your form results and see form statistics in S-Drive, but you'll need to upload all your form's files yourself. This means that there are a couple more steps to perform before the form will be visible in your project.

First, choose File > Export > Automated Form Processing to export the form, and choose a location where all of your form's files will be saved. Web Form Builder will publish items to S-Drive that make the automated form processing work. You should then see the Form Exported window.

First, click Copy to Clipboard under Step 1 to copy the code that will be placed in the header of the webpage. Now switch to Visual Site Designer and go to Edit > Edit Header... to open the Head Section HTML and Onload Events window:

Paste the code into this box and click OK. Now go back to the Form Exported window in Web Form Builder and click Copy to Clipboard under Step 2 to copy the code, then click the Add HTML button in VSD:

This opens the Insert HTML window. Label the form by entering a name in the HTML Object Name field, then paste the code into the text area below the Body HTML tab:

Click OK and your object will be placed on your VSD webpage. Position it wherever you like. Now there's only one thing left to do: Upload the files to your website! Go back to the Form Exported window in Web Form Builder and look at Step 3. You'll need to use an FTP program to upload that entire folder to the folder your VSD website will be saved in. If you're publishing your VSD website to S-Drive, note that you can use Direct FTP to upload your files to S-Drive.

Now you can click the Preview toolbar button in Visual Site Designer to see your form in action!

Click here to learn how to display your form in a pop-up over your webpage.

Adding Your Form When Exporting with a Manual Server Setup

When you export your form using the Manual Server Setup option, you'll still get to read your form results and see form statistics in S-Drive, but you'll need to upload all your form's files yourself. This means that there are a couple more steps to perform before the form will be visible in your project.

First, choose File > Export > Manual Server Setup to export the form, and choose a location where all of your form's files will be saved. Web Form Builder will export all the files that make your form work to your computer. You should then see the Form Exported window.

Click Copy to Clipboard under Step 1 to copy the code, then click the Add HTML button in VSD:

This opens the Insert HTML window. Label the form by entering a name in the HTML Object Name field, then paste the code into the text area below the Body HTML tab:

Click OK and your object will be placed on your VSD webpage. Position it wherever you like. Now there's only one thing left to do: Upload the files to your website! Go back to the Form Exported window in Web Form Builder and look at Step 2. You'll need to use an FTP program to upload the contents of that folder to the folder your VSD website will be saved in. If you're publishing your VSD website to S-Drive, note that you can use Direct FTP to upload your files to S-Drive.

For more help with the Manual Server Setup option, and instructions on how to upload your files with Direct FTP, read this article.

Now you can click the Preview toolbar button in Visual Site Designer to see your form in action!

Click here to learn how to display your form in a pop-up over your webpage.