Skip to main content

Building the Registration Form with Form Designer

Form Designer

Welcome to our Form Designer, your all-in-one tool for crafting registration forms with ease. Say goodbye to toggling between editor tabs – now you can design your form and questions seamlessly within one intuitive interface.

Ready to get started? Simply head over to the Registration tab and dive into the management menu. Click on 'Form Designer - Beta' to unleash the power of our interactive editor.

Once inside the Form Designer select the 'Launch form editor' button and you'll find a sleek preview of your registration form. Need to tweak the layout or preview it for different groups? No problem. Utilise the dropdown menus at the top right to tailor your view precisely to your needs.

Navigate through tabs like 'Form', 'Header', 'Page', 'Text', and 'Messages' to access a plethora of customisation options. From shaping the form's layout to infusing your brand's identity into every aspect, the controls you need are at your fingertips.

And here's the best part – every change you make is instantly reflected in the real-time preview panel on the right. No guesswork, just seamless design.

So, what are you waiting for? Let your creativity flow and watch your registration form come to life effortlessly.

[INSERT SCREENSHOT/DEMO HERE]Preview - 1.png

Form Tab Overview:

In the Form tab, you wield the power to shape your registration form exactly as you envision it. We've streamlined the process by auto-generating a basic information section, complete with fields for Email, First Name, and Last Name, so you can hit the ground running.

Adding new fields to this section is a breeze – just click the '+' icon. And if you need to bid farewell to a section, simply click on the ‘Bin’ icon. Need to tweak the details of a section? The ‘Pencil’ icon is your go-to for quick edits.

But wait, there's more! Feel free to expand your form's horizons by creating new sections with a simple click of the 'Create new section' button.

Ready to unleash the full potential of your registration form? Let's dive in!


[PLACE HOLDER INSERT SCREEN SHOT]

Preview - 2.png
When fine-tuning your section, you're in control. Edit the Section Title and Icon to ensure clarity and cohesion within your form. Want to tailor visibility? Add a 'Group' to restrict access to specific people groups, ensuring information is shared selectively. And for added context, enrich your section with a description.

[PLACE HOLDER INSERT SCREEN SHOT]

Preview - 3.png
If you click on the ‘v’ icon, the section will expand and display the list of fields you have added for that section. To edit the field, click on the ‘Pencil’ icon. You can also move the field into another section by clicking on the ‘Double Arrows’.

[PLACE HOLDER INSERT SCREEN SHOT]

Preview - 4.pngFinally, to re-order the field or the section, click, hold, and drag the field or section.

Field Options within the Form

  1. Text field – This is a simple one-line text field which is appropriate for small responses.
  2.  Checkbox field – This field can be used for simple yes or no questions.
  3. Dropdown field – This field is useful to present users with a long list of predefined options.
  4. Rich Text field – This field will allow users to write longer content with rich text editing options.
  5. Radio field – This field is useful to present users with a short list of defined options.
  6. Multi-Select field – Similar to the checkbox, but allows users to select multiple options from a predefined list.
  7. Ordered Multi Select field - A multi select that the user can re-order to rank options.
  8. Image Upload - Allows users to upload images and optionally map to their profile picture (authenticated registrations only).

[PLACE HOLDER INSERT SCREEN SHOT]

Field Configuration

When you select a field, you will be presented with the configuration dialog.

On this dialog, you will see four tabs, and they are:

  1.  – Where you add the label name for the field and an optional short description.
  2. Validation – You can opt to make this field mandatory or optional and set the maximum and minimum length of the text the users can enter.
  3. Connect – You can map the current field to either the Profile or a Custom field in CrowdComms.

    Please remember that if you want to connect the response in the form to a custom field, you must first add the custom field in the People’s Profile setting. 

  4. Visibility – You can customise this tab to configure when to show or hide this current field based on the user’s response to other fields, as well as add a People Group to restrict the visibility of this field to specific people groups. Please refer here for explanations of how to configure this tab.

 Once you’re happy with the text field configuration, click ‘Submit’.

Visibility (All fields)

i.    There are a few ways to use this Visibility configuration. The simplest one is if you want to show or hide the current field based on the user’s response to a previous field, as well as add People Group to restrict the visibility of this field to specific people groups.

ii.    For example, you can decide to show or hide a checkbox question based on the answer provided in the previous field(s) of the registration form.

iii.    Say you want to ask a follow-up question, ‘Do you ride to work?’ to users who have responded Yes to having a bicycle. You can add a configuration for the current field to only appear for those users who have answered Yes. And not to appear for users who answered No.

iv.    You can also configure the current field to check multiple other previous fields before it shows/hides the current field based on the user’s responses. 

v.    As an example, if your current field asks the users if they ride to work, you may want to check if your users have answered True in some of the other previous fields, such as, if they ‘Own a bicycle’ or if they ‘Work from an office’.

vi.    If you want the current field to only show if the users have answered all of the relevant questions with True, then select ‘When all the following are true’ from the Select Logic dropdown.

vii.    But, if you want at least one of the relevant fields to have been answered True, then select ‘When some of the following are true’ from Select logic the dropdown options.

viii.    You don’t need to create the opposite response configuration, i.e. ‘Hide this field’ if the users responded to not having a bicycle.

ix.    On Select Logic, there are 2 options available. If you have one or multiple fields you want to check for this configuration, select ‘When all the following are true’. 

x.    For this logic, the system will look for all the relevant fields you’ve configured and check that the users have answered True on all of them.

xi.    The other option is if you have multiple fields and you want the system to check that your users have answered ‘Yes’ to at least one of them, select ‘When some of the following are true’ from the dropdown option. 

xii.    What this will do is, if you have 2 questions which you have configured with this current field, the system will look at whether at least one of the answers is True, and if so, the current field will appear to the user. 

xiii.    The next step is to add the visibility Conditions. On this table you will need to add all the field(s) you want the configurations to check. 

xiv.    Click on the ‘+ Add’ button and another dialog will appear. You must ensure that the field already exists in the registration form. 

xv.    On the dialog, select the Field, Comparison and/or the Value. Please note that depending on the field type, some of the dropdowns may not be applicable to the configuration. Such as for the Text Field type, you won’t need to add the Value.

xvi.    If you want to add more fields to the current field’s configuration, repeat steps ix – xii. 

For more information on creating your form, please click here.

Advanced Tab Overview:

The advanced tab offers you additional customization through being able to edit and add your own CSS styling.


Once you've effortlessly fine-tuned each tab to perfection and the preview panel reflects your vision flawlessly, it's time to seal the deal. Simply click the 'Save Changes' button to apply your edits. With one swift click, your masterpiece comes to life, ready to captivate attendees and elevate your event experience to new heights.