Forms

Xara Xtreme 5 and Web Designer allow you to add forms to your website using widgets. Below we give a step by step guide to inserting two of these, from JotForm and Google Gadgets.

JotForm

1
Browse to the JotForm homepage.
2
Log in to your account or click on Sign Up to create your own JotForm account if you don't already have one.
3
Once you are signed in, click on the option ‘New’ under My Forms.
4
Select the type of form you wish to create from the options in the Form Wizard and click on Next.
5
Select a style to be applied to your form from the drop list provided and then click Finish.
6
Your custom form will now be shown. Click on the Form Wizard button to configure the form properties, the address the form is submitted to, whether a confirmation email is displayed and the message to display on the thank you page displayed after the form is submitted.
7
Jotform allows you to add more form controls directly from the Toolbox shown on the right side of the form. You can also expand the Power Tools and Payment Tools options below, to further customize your form.
8
Next, click on the Source option in the toolbar above the form. Copy the code provided.
9
In Web Designer or Xtreme 5, open the web page in which you wish to embed your form.
10
Using the Rectangle tool, insert a placeholder on your web page where you wish the form to appear.
11
Open the Web Properties dialog via Utilities > Web Properties (or by clicking on the icon in the web toolbar or Shift+Ctrl+W) and then click on the Placeholder tab.
12
Enable the radio button Replace with HTML code and paste (Ctrl +V) the code you copied in step 8.
13
Click on OK to apply the changes and close the dialog.

Google Gadgets

1
Browse to Google Gadgets.
2
Use the search field to search for other form types. The web page will display a selection of 14 different types of forms.
3
Click on ‘Add to your webpage’ button associated with the form you wish to create, that will take you to the form editor.
4
Configure the form as required from the options available below ‘Display Settings’ and ‘Gadget Settings’ and click on the button ‘Get the Code’.
5
Copy the code provided.
6
In Web Designer or Xtreme 5, open the web page in which you wish to embed your form.
7
Using the Rectangle tool, insert a placeholder on your web page where you wish the form to appear.
8
Open the Web Properties dialog via Utilities > Web Properties (or by clicking on the icon in the web toolbar or Shift+Ctrl+W) and then click on the Placeholder tab.
9
Enable the radio button 'Replace with HTML code' and paste (Ctrl +V) the code you copied in step 5.
10
Click on OK to apply the changes and close the dialog.