Avada Form Options

16/04/2022

For each individual form you create in the Avada Form Builder, there is the Form Options panel, to customize its appearance, specify submission options for your form, create notifications and confirmation messages, and to set privacy options.

In Avada Builder (the back-end editor) the Form Options are found at the bottom of the page, where the Page Options usually reside. In Avada Live, as you can see in the image below, they’re in the Sidebar, again, where the Page Options usually reside. Read below to look at each of the Form Option sections in turn, and watch the video below for a visual overview.

Avada Form Options

Overview

Settings

This page simply controls the Page Title and Slug for the Form.

View the Options Screen

General

  • Enable Member Only Form – Select if you want to display this form to only logged in users with specific user roles. Choose from Yes or No.

  • Select User Role(s) – (displays only if the option above is set to Yes.) Select user role(s) you want to display this form to. Leaving blank will display form to any logged in user. Choose from Administrator, Editor, Author, Contributor, or Subscriber.

View the Options Screen

Submission

The Submission options control what happens when someone submits the form. Depending on the Submission Type selected – AJAX or POST various options will be available. Select “AJAX” to store form data using predefined methods and “POST” if you want to implement your own.

AJAX

  • Actions – Select actions to apply when form submit. Choose from Save To Database, Send To URL, Mailchimp, and/or HubSpot. Multiple selections can be made.
  • Save To Database – You can view and manage form submissions by going to Form Entries section and selecting the form from the dropdown list. In general, storing form data in a database table is a convenient way to manipulate the received data and to create stats, do analysis etc. Also, through this option you can store the data directly on site. The database table can easily be exported or even connected to an automated script, which can do all sorts of data manipulation for you.

  • Send To URL – Depending on the script running on that URL, submission data could be caught and processed, either by a custom script, or through a dedicated URL provided by a newsletter service supplier. Also, it allows you to show a custom created success page, with Call To Actions etc.
  • Submission Method – Make a selection for form submission method. Choose from Post, or Get.

    GET: Appends form-data into the URL in name / value pairs. It has a limit of a few thousand characters because of this and is not the right option if you send sensitive data. It is convenient though for creating bookmarks and also to extract the data (which is something the site owner has to do).

    POST: Appends form-data inside the body of the HTTP request. There are no size limitations and the data is not part of the URL, thus it is more secure.

  • Form Submission URL – Enter the URL where form data should be sent to.

  • Custom Headers – If you are using this form to integrate with a third-party API, you can use custom headers to implement authentication or pass-on any extra headers the API requires. Button: Add Headers.
  • Custom Header Key – (displays when Add Header is clicked) Enter the key for the request’s custom header. Example: Content-Type
  • Custom Header Value – (displays when Add Header is clicked) Enter the value for your custom-header.
  • Mailchimp – Sign up for a Mailchimp account and manage your contacts in their free CRM. For more information check out our Mailchimp integration guide.
  • Mailchimp ActionSelect if you want to perform a Mailchimp action after form submission.
  • HubSpot – Sign up for a HubSpot account and manage your contacts in their free CRM. For more information check out our HubSpot integration guide.
  • HubSpot ActionSelect if you want to perform a HubSpot action after form submission.
  • Open Off Canvas – You can also trigger an off canvas to display upon the submission of a form.
  • Off CanvasSelect Off Canvas to open after form submission.

POST

  • Submission Method – Make a selection for form submission method. Select from Post, or Get.

Save To Database
Send To URL
Mailchimp
HubSpot
Open Off Canvas
Avada Website Builder

804,910 Businesses Trust Avada

Get Avada
Avada Website Builder

804,910 Businesses Trust Avada

Get Avada
Avada Website Builder

804,910 Businesses Trust Avada

Get Avada

Appearance

With these options you can control the overall appearance of your Form, including colors, margins and borders.

  • Preview Width – Select the width to preview the form at in the live editor. Note: this is only used for previewing purposes.

  • Label Position – Make a selection for form input fields labels position. Choose from Above, or Below.

  • Tooltip Text Color – Controls the text color of the field tooltip.

  • Tooltip Background Color – Controls the background color of the field tooltip.
  • Field Margin – Controls the vertical height between form fields. In pixels (px), ex: 10px.

  • Field Height – Controls the height of the form fields. Use any valid CSS value. Leave empty for default value.
  • Field Font Size – Controls the font size of the form fields text. Use any valid CSS value. Leave empty for default value.
  • Field Background Color – Controls the background color of the form input field. Leave empty for default value.
  • Field Text Color – Controls the text color of the form input field. Leave empty for default value.
  • Field Label Color – Controls the label color of the form input field. Leave empty for default value.

  • Field Placeholder Color – Controls the label placeholder of the form input field. Leave empty to use a faded version of the form text color.
  • Field Border Size – Controls the border size of the form fields. Leave empty for default value.
  • Field Border Color – Controls the border color of the form input field. Leave empty for default value.
  • Form Border Color On Focus – Controls the border color of the form input field on focus. Leave empty for default value.
  • Field Border Radius – Controls the border radius of input field. In pixels. Leave empty for default value.

View the Options Screen

Notifications

With the Notification options, you can add any number of notifications of the submission of your form. These could be in the form of an auto reply to the sender, or a direct email submission, just to name a few. You can also have multiple notifications for the same form.

In email options, field names within square brackets can be used as placeholders which will be replaced when the form is submitted, ie: [email_address]. For more information check out our Form Placeholders doc.

  • + Add Notification – Click this to add a new notification for the form.

  • Notification
  • Label – Enter notification label.

  • Email – Enter email ID where form data should be sent to. If left empty, email will be sent to the WordPress admin.

  • Email SubjectEnter email subject. If left empty, the form title will be used.
  • Encode Email Subject Select if you want to encode email subjects. This helps to display special characters correctly in the subject field. A few hosting environments and email clients might have issues with this setting.

  • Email From Name – Enter email from name. If left empty, WordPress will be used.

  • Sender Email Enter sender email address. If left empty, wordpress@sitename.com will be used.
  • Reply To Email Enter reply to email address.
  • Attach Uploaded FilesAdd uploaded files as email attachments.

  • Email Message – Enter email message, leave empty to get the default message with all form fields. You can add form fields to the message by insert field name wrapped with square brackets ie: [email_address], also you can add all fields with [all_fields] tag.

View the Options Screen

Confirmation

With these options you can control the overall appearance of your Form, including colors, margins and borders.

  • Form Confirmation Type – Select what should happen after the form is submitted successfully. Choose from Display Message, or Redirect To URL. When using Display message, you use the Notice Element in your Form to display your Success and Failure Messages. These can be placed anywhere in the form, for example at the bottom, or the top. If they are at the top, when the user submits the form, the page will scroll to the top of the form and display the message.

  • Redirect URL– Only displays if above option is set to Redirect To URL. Enter the URL which the user should be redirected to after a successful submission.

View the Options Screen

Privacy

With these options you can control the privacy options for the Form.

  • Store IP and User-Agent – Select if you want to store the IP and User-Agent on submissions. Depending on the legislation that applies to your site, you may need to disable this option. Choose from Yes, or No.

  • Duration of Submissions Log (Months) – Select the duration for which form submissions will be kept in months. You can choose what happens on expiration below.

  • Submission Expiration Action – Choose what will happen when the time defined above comes to pass. If you have selected to log the user’s IP & UA above, selecting “Anonymize IP and User-Agent” will delete these from the log. If you want old entries to be deleted automatically after a certain time, then select “Delete Submission”.

View the Options Screen

Custom CSS

On this tab, you can add Custom CSS to the Form.

  • CSS Code – Enter your CSS code in the field below. Do not include any tags or HTML in the field. Custom CSS entered here will override the theme CSS. In some cases, the !important tag may be needed. Don’t URL encode image or svg paths. Contents of this field will be auto encoded.

View the Options Screen

Import / Export

On this tab you can export and import form options.

  • Import Page Options – Import Page Options. You can import via file or copy and paste from JSON data.

  • Export Page Options – Export your Page Options. You can either export as a file or copy the data.

View the Options Screen
Avada Website Builder

804,910 Businesses Trust Avada

Get Avada
Avada Website Builder

804,910 Businesses Trust Avada

Get Avada
Avada Website Builder

804,910 Businesses Trust Avada

Get Avada