Skip to content

Main Navigation

Radius Forms
Form Elements Setup Logic Form ID Page Templates

Form Elements

PLEASE NOTE
  • Don't use the Field ID 'message' for any field.
  • When using Datatracker, a dedicated email or telephone field is needed to submit.
General settings
Repeated settings used in the elements
  • Field ID - This needs to be present and unique for each field. Use this input to add in the corresponding field code on Datatracker or Salesforce. No spaces or punctuation (except - or _ ).
  • Dedicated Field - Tick this if using a corresponding field code that matches the one on Datatracker or Salesforce. Anything not dedicated gets added to the 'message' field on Datatracker or Salesforce.
  • Validation - Tick this to edit validation settings for the field.
  • Validation Conditions - This appears when the above is ticked. You can choose how this field gets validated and what error message is shown.
  • Show Helper Text - Tick this to edit helper text for the field.
  • Helper Text - This text gets shown under the field to help the user.
Question Text

Uses: Dedicated Logic

  • Question Text - Use this as a heading for certain fields, such as radio/checkbox buttons or quantity. Alternatively, make it a heading to help the user complete the form.
Text / Email / Telephone Field

Uses: Validation

  • Label - This is shown above the field and as a placeholder.
  • Hide Label - The label can be hidden leaving just the placeholder (useful for multi-line address fields).
Textarea Field

Uses: Validation

  • As 'Text / Email / Telephone' above plus:
  • Rows - This changes the default height of the textarea input box.
Radio Buttons Field

Uses: Validation

  • Style - Front end style option.
  • Columns Mobile - Sets the coloumn count for mobile sized screens (smaller than 768px).
  • Columns Desktop - Sets the coloumn count for larger sized screens (more than 768px).
  • Options - Label - Text shown to the user with the option.
  • Options - Value - Value submitted, not shown to the user.
  • Options - Image URL - Add image url from Cloudinary. Each image needs to be the same dimensions in the option group.
Checkbox Buttons Field
  • As 'Radio Buttons' above plus:
  • Group Checkboxes - Will group all checked options under a single Field ID if ticked.
  • Group Field ID - A single ID for Datatracker or Salesforce (alternatively will get added to the Message field if not dedicated).
Quantity Boxes Field
  • Quantity Box Style - Front end style option.
  • Columns Mobile - Sets the coloumn count for mobile sized screens (smaller than 768px).
  • Columns Desktop - Sets the coloumn count for larger sized screens (more than 768px).
  • Smaller mobile text - Reduces the label font size for mobile sized screens (smaller than 768px).
  • Align on mobile - Places label and quantity box on the same horizontal line for mobile sized screens (smaller than 768px).
  • Quantity Boxes - Min Value - Sets the minimum value this quantity box can go to.
  • Quantity Boxes - Max Value - Sets the maximum value this quantity box can go to.
  • Quantity Boxes - Defaulty Value - Sets the default quanity value.
  • Quantity Boxes - Image URL - Add image url from Cloudinary. Each image needs to be the same dimensions in the quantity boxes group.
Tick Box Field

Uses: Validation

  • Position - Where the tick box is located.
Hidden Field
  • Used to submit form specific data.
Results Page

Uses: Dedicated Logic

  • Used to send the user to a specific page after the form has been submitted.
reCapture
  • reCapture Token - Add the token provided by Google.
Field Columns
  • This element allows you to add multiple fields in columns. Each element will be put in a 50% column on desktop, but will be full width on mobile. Only available for Text, Email, Telephone and Textarea Fields
Steps
  • Use this option when you are wanting a stepped form (with next/previous buttons). If using this, you must add a Step element as the first item when building the form. Everywhere you place another Step element will be the start of a new step.
  • There are additional settings in the Form Setup at the top of the page.

Form Setup

Tab - Setup
General form settings
  • Form Language - Choose the language for this form. Each language needs to have its own form. This also sets the privacy notice below the form.
  • Form Source - Choose the source for this form.
  • Submit Button Text - Add in the text to be displayed in the submit button.
  • Submit Button Size - Alters the size of the submit button.
  • Submit to - Changes where the form data gets sent.
  • Salesforce OID - Add in the OID from Salesforce.
  • Salesforce Source ID - Add in the ID from Salesforce that will store the Form Source (see above).
  • Salesforce Message ID - Add in the Message ID used in Salesforce for this Form Source. This is the field that any non-dedicated fields will get added into.
Tab - Styling
General form styling
  • Here you can change the styling and colour options for the form.
Tab - Steps
Button and styling for Steps
  • Next Button Text - Add in the text to be displayed in the steps Next button.
  • Previous Button Text - Add in the text to be displayed in the steps Previous button.
  • Previous Button Styling - Change the look of the steps Previous button.
  • Group Step Elements - Adds a border styling to the fields in each step.

Form Element Logic

At the bottom of the page is an option to enable logic on the form. This requires correctly inputing logic controls so should only be completed by those comfortable with the settings.

Some elements have a dedicated logic section (which will show if Enable Logic Options is set to yes). These elements are tagged in the Form Elements tab of this guide.

Using Logic
  • Target Element - Add in the field ID of the element you want to target. Needs to be copied exactly.
  • Action - Chose what happens to the Target. Display will show or hide the Target, value will change the Targets value.
  • Control Element - Add in the field ID of the element that will trigger the change to the Target.
  • Control Type - The Control type of element. This chooses the setup for the logic.
  • There is a variety of settings that you can chose to control the Target.

Form ID

The Form ID can be found in two locations. The first when editing the form:

https://radiusforms.creativetheorylab.co.uk/wp-admin/post.php?post=756&action=edit

The second when viewing the frontend of the form:

https://radiusforms.creativetheorylab.co.uk/?page_id=756

Page Templates

There are 3 templates dedicated for forms:

  • Default template - This is the main template to use when building and testing the form.
  • No Bootstrap - For devs - This is the template for code developers to ensure that the styling and function of the code works standalone from the Wordpress theme.
  • Live Form - Once the form has been created and tested, it can be set to the Live Form template. This is a safe page template that won't be effected by any work in progress dev changes being made to the above two themes.